CODEWITHSUNDEEP
cssmicrosoft-metroflexbox
Alex
Alex

Reputation: 68438

Can the windows metro style layout be reproduced with flexboxes?

enter image description here

Can this type of layout be implemented using non-nested flex boxes?

I know that flex-wrap will make the boxes go on the next line if they don't fit, but how can I also get boxes with variable height like in the screenshot above, without nesting more flex boxes?

Upvotes: 4

Views: 3807

Answers (1)

vanthome
vanthome

Reputation: 4926

Yes, with some normal CSS float based grids, it is possible to create boxy layouts like these. For example see this example and how the author did it.

Also MS proposed a standard called "CSS Grid Layout" to the W3C which is described in MSDN. It allows to create such layouts without flexbox support. It never got adopted outside IE but if you only need to care about IE, you can use it.

Upvotes: 3

Related Questions