Grid lay-out

Rows inside rows, manipulation of width regions. It is simple mathematics.

You cannot achieve it if you dont add Row control inside Row control (wrapper). For this layout you need at least 7-9 rows controls.

i'll give it a shot. Thanks!

Remember, it is not important what you add inside columns, as long it has no margins and paddings.
Separate in your mind those two problems.

And where you have one straight white line beneath blocks (columns) there is your end of one separate Row control.

So first i make a section. In that section i make a row and in that row i make another row? Is this the way? What do you mean with 'wrapper' (i only now wrapper to put some external material inside an article).

regards

Last edited 07 November 2015 by kverweij

You dont need sections. But if you want it OK. It is addiotional HTML and CSS code.

Row inside row you need only when height of one column is different than height of neighbouring column. You could do it with other options but better not, to give it chance to behave OK in responsive modes.

"Wrapper" is just one row wher you put second row control.

This in middle two blocks one above each other can you make with simple containers, display:block for them. Problem is height of your content inside columns. They will decide if it looks nice as on this website.

Here is a screenshot. There are many ways to get this layout, I tried with most simple as I think it is. Depends much on what is your content for columns, and how do you want it to behave in small devices. It is up to you to fix it.

Dont try to force width in percentage % for columns, just use number of Bootstrap regions for column/s. With percentage you will make a mess of it.

thanks for your great support!