Grid layout in CSS

Question

Using Bootstrap, what will be the best way to achieve this type of layout. These posts are in a loop and should display on a page of 16.

Thanks in advance

UPDATE Thanks to Dublin (comment) directing me to the correct CSS layout

This is what I came up with, if it can help other `

      <?php if($count == 2 || $count == 4 || $count == 6|| $count == 8|| $count == 10|| $count == 12 || $count == 14){?>
      </div>

      <?php }?>`

are you looking for something like this: [equal height columns](http://getbootstrap.com.vn/examples/equal-height-columns/)? if example couldn't help, update question with your markup or create [jsfiddle](https://jsfiddle.net/) — Igor Ivancha, Apr 25 '16 at 17:39
that can be easily achieved using nested columns [Bootstrap combining rows (rowspan)](http://stackoverflow.com/questions/16351404/bootstrap-combining-rows-rowspan) — Daniel Arechiga, Apr 25 '16 at 17:40

score 0 · Accepted Answer · answered Apr 25 '16 at 17:25

0

I would put the first two 'top' elements in a row div. Then add the second smaller one with a pull-right in the class. Just pull-left on the large div in the second row and then pull-right on the second smaller one. Here's what I'm talking about in pretty colors

answered Apr 25 '16 at 17:25

Dublin Anondson

26
6

Apologies for the hasty construction, I hope it gets the point across well enough! – Dublin Anondson Apr 25 '16 at 17:25
Thanks Dubin, this is putting me in the right direction. Any idea how I will implement this into a Wordpress Loop? – wp supprt Apr 26 '16 at 08:36
So I've never worked with Wordpress ever in my life but here's some info on the [loop](https://codex.wordpress.org/The_Loop). – Dublin Anondson Apr 26 '16 at 12:47

Grid layout in CSS

1 Answers1