Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trialDean Conway
3,301 PointsFloats, Flexbox or CSS grid?
Hi
Now that CSS Grid has arrived as the latest cool kid on the CSS scene which, from what I have read, seems to be revolutionising the way we will be building websites in the near future. But now I am totally unsure if I should be using Grid 100% of the time from now on in all my web projects that I build from scratch or is it still in to much of a half baked state to be used at a production level?
If it is, then that still leaves with choosing between Floats and Flexbox, or does it not really matter which method I pick as long as I stick to it and use it consistently throughout my project?
Dean
4 Answers
Bruno Navarrete
Full Stack JavaScript Techdegree Graduate 22,246 PointsI'd recommend keeping true to what you like right now. Flexbox still covers pretty much everything you need to create dynamic, responsive websites (the alpha-6 version of Bootstrap 4 uses a flexbox grid). Still, keep your eye on CSS-grid and any new technology out there ;)
Rhys Kearns
4,976 PointsPractical: CSS Grids > Flexbox > Floats
Browser Support: Floats > Flexbox > CSS Grids
Although Flexbox is pretty much supported by all browsers it really depends on what you are working on - I would recommend staying away from CSS-Grids whilst it is so badly supported although it is the future of CSS. http://caniuse.com/#search=flexbox http://caniuse.com/#search=css-grid
Dean Conway
3,301 PointsHi Rhys & Bruno.
Thank you for both for your answers.
To be honest Bruno, I've invested a lot of time trying to get my head round floats, (I'm a designer trying to learn how to code) so I would rather stay committed to using floats. I just did not want google ranking my site lower because I am using an older technique of css layout compared to Flexbox or Grid or for potential employers to inspect my portfolio code, see that I've used floats and then think of me as a less skilled candidate because i'm not using the latest techniques even though they all end up achieving the same responsive results just in different ways - Do you think that would be the case?
Rhys Kearns
4,976 PointsThe point of using the latest techniques isn't because you are more skilled or because you want to follow everyone else, its because they have some incredibly useful tools. Floats work but flexbox has so many cool features for you to use, whilst CSS-Grids does also its just not supported enough yet, I would say you should avoid using floats unless necessary as Flexbox is the near future of CSS.
Dean Conway
3,301 PointsOk thanks for your feedback Rhys, things is the side project I am working on at the moment to practice my coding skills I have started to use floats, so I might as well stick to carrying on using them as the underlying method for controlling the layout of my site. But for my portfolio website, which I have already wrote the html for but no CSS yet, maybe that would be a good time to start understanding and implementing the Flexbox technique.
Rhys Kearns
4,976 PointsSounds like a good idea :) No point in redoing whole projects - good luck!
Bruno Navarrete
Full Stack JavaScript Techdegree Graduate 22,246 PointsThat does sound like a good idea. A new (deadline-less) project is always the best moment to start lerning and experimenting. Who knows? Maybe you'll want to re-do your first project or even start a new one just to practice ;)