Multi row bootstrap layout

[cives]

Hi all – simple question here,

Anyone know how to achieve a layout like this:

https://preview.ibb.co/go9vDm/Screen_Shot_2018_01_31_at_4_34_00_PM.png

Assuming the grey boxes are div’s? The site is built in bootstrap, so the challenge is having a right-aligned multi-row set, to the right of one larger div.

This site: https://stripe.com/atlas/guides is my inspiration, so I am developing little “resource” cards, but I’d like to achieve a layout similar to the provided screenshot.

Thanks

[Beverleyh]

Maybe try thinking about the outer containers before working inwards. Try 2 outer divs that are each 50% (so they sit side-by-side), and then put 2 100% divs in the right-hand parent.

It’s hard to suggest anything without knowing the behaviour you’re after, or the markup/content inside, so try setting up a simple demo in CodePen to illustrate what you’re trying to do and show is any undesirable behaviours through that.

[Paulie_D]

Also which version of Bootstrap you are using as they have very different behaviours and layout methods depending on the flavor chosen.

[Author]

Posts