CSS Grid is it ready ?

[jamieh2os]

Please share your thoughts

CSS Grid is it ready; I have been working with CSS Grid. I’m relatively new to Site Development. My reasoning is why be an expert at Bootstrap or Flexbox when CSS Grid is going to be the best.  However, I have found CSS Grid to very inconsistent and difficult to make responsive.  I’m giving up trying to use it for the entire site design.  Even with all hype of CSS Grid easily adapting to newspaper style layouts and putting elements on top of each other with z-index.  CSS Grid is just not ready.  I feel that when it is ready Dreamweaver and Bootstrap will be fully supporting it.  Thanks for your input

[Jon Fritz]

I don't think the time has come yet to switch over to Grid, but that's not based on the Grid spec, that's ready. I base my decision on how the viewers of my sites interact with the internet. I have far too many older IE browsers visiting my sites to make the transition worthwhile from a coding aspect.

I'll continue to play with Grid, to learn as much as I can for the time when my viewers are ready for it, then happily switch over.

[pziecina]

This is my personal view on css grids, and everyone will have their own view.

css grids is great if you intend to use media-queries often. Yes you can make the layout resize (as one would do with an adaptive layout), but I have found that in order for grids layouts present the best possible layout for various screen sizes, one has to redo the layout much more often than with flexbox, and sometimes even when using floats.

Bootstrap 4 which uses flexbox as its default for layouts has just been released, (no longer beta). So it will be at least 3-4 years before it may be updated to support css grids.

You may want to try combining both css flexbox and css grids, as that at the moment appears to be the best solution, depending on what you are doing. You may even find that for some layouts floats are the best solution, just because everyone is 'shouting' about a feature, does not mean you should follow them.

[pziecina]

Just thought I would mention one other css layout feature that tends to be forgotten by many, and that is css multi-column layouts.

https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Columns/Using_multi-column_layouts

Depending on what you are doing, you can use all the various methods of css layouts, including combining the use of them all. Just remember to check that your page/site remains usable even if a feature is not supported. The old 'it must look the same to every user', is no longer valid, (or possible).

[BenPleysier · Accepted solution]

On that subject, it may be worth following the development of display: contents. Firefox already ships it with Chrome and WebKit close on its heels. This will be a handy aid for Flex and Grid.

Have a look at Vanishing boxes with display contents

[W_J_T]

These seemed relative to the discussion.

jamieh2os  wrote

Why be an expert at ... Flexbox when CSS Grid is going to be the best.  However, I have found CSS Grid to very inconsistent and difficult to make responsive.  I’m giving up trying to use it for the entire site design.

pziecina  wrote

You may want to try combining both css flexbox and css grids, as that at the moment appears to be the best solution, depending on what you are doing. You may even find that for some layouts floats are the best solution

Flexbox vs. CSS Grid — Which is Better? - YouTube​

https://forums.adobe.com/people/Jon+Fritz+II  wrote

I don't think the time has come yet to switch over to Grid, but that's not based on the Grid spec, that's ready. I base my decision on how the viewers of my sites interact with the internet. I have far too many older IE browsers visiting my sites to make the transition worthwhile from a coding aspect.

Internet Explorer + CSS Grid? - YouTube

-------------

You can also find many basic CSS Frameworks for layout that people have created that use CSS Grid and Flexbox with various fallbacks, etc., to review.

[pziecina]

jamieh2os  wrote

...  I feel that when it is ready Dreamweaver and Bootstrap will be fully supporting it.  Thanks for your input

No one has really touched on this so -

This is the one part of your question that you should ignore. Simply because Dreamweaver is not the only code editor out there, and even some of the free code editors have grid support, (with an easy to use autoprefixer as described in the 2nd video). So your competition, (no matter what it is, work, freelance, self-employed) may well know how to use css grid, and be using css grid long before Dreamweaver has better support than the latest version has, (Dw's current version (18) grid support was taken from the Brackets code editor).

As for Bootstrap. I mentioned this in my first reply. Other frameworks may introduce css grid support years before Bootstrap, so don't wait for Bootstrap support, or think that it is the only framework.

To sum up, never wait for or rely on a single editor, (Dreamweaver) or framework, (Bootstrap) to support anything. If you do that you WILL find yourself years behind web developers/designers using other editors/frameworks/hand-coding.

This also applies to many html5, css, javascript api, features that have widespead browser support but ​NO ​support in Dreamweaver.

[jamieh2os]

Thank you to all who replied to this post........james