Ger van veen wrote:Frank Cook wrote:This thread may be of interest on the matter.
Frank
all links do not work in this explanation
My testing of using autoprefixer 9.4 with ms-grid to support IE10 and IE11 led me to one conclusion. You are still designing first for another format (old ms-grid) rather than designing using "new grid spec" first. Why limit yourself to designing something for either fallback (old) first or partial grid support using autoprefixer and then try to use grid to offer up something on top of it ?
Grid is too advanced once you start to get into layering and min/max setups etc. The grid layout tool is endless.
The problem comes down to the
html structure. You cannot think for one minute you are going to design with grid and then magically switch to another mode and use flex for a fallback. Flex will just give you a checkboard layout effect. Lets say I have 90 (yes I said 90) items in a container set to grid all set using both line placement and name placement and intermixing them using the z-index layering method for one section. Lets say I have 5 sections too....
When you try to convert that complex layout back to flex you only have the choice of arranging (flexing) them.
Its the
html structure that will limit you as to providing a proper fallback with flex. The only solution I see is to load or replace the html section with a "new" section based on a support query that test for old browsers that do not handle the "true" grid specification. Interesting one can still use the same structure and classes but add in the containers, row, columns, etc to the replacement html so one can still use the same text styles, etc.
Bootstrap 5 CSS Grid.