Grid layout new row
Permalink
Is there a way to add a new row to a bootstrap 3 gridlayout?
I can only see a way to add blocks to the column within a row, rather than add a new row with more columns.
In the attached image, each cell of the grid has e.g "cell 1", "cell 2" in it. If 3 and 4 were on a new row, as desired, they would be at the same vertical position.
The only way I can see to achieve this behaviour is to add a new layout entirely, which is cumbersome and not usable in my project.
In other words, I want the html to look something like:
instead of:
I can only see a way to add blocks to the column within a row, rather than add a new row with more columns.
In the attached image, each cell of the grid has e.g "cell 1", "cell 2" in it. If 3 and 4 were on a new row, as desired, they would be at the same vertical position.
The only way I can see to achieve this behaviour is to add a new layout entirely, which is cumbersome and not usable in my project.
In other words, I want the html to look something like:
<div class="container"> <div class="row"> <div class="col-sm-12"> <div class="row"> <div class="col-sm-6"> <p>cell 1</p> <p>cell 1</p> <p>cell 1</p> </div> <div class="col-sm-6"> <p>cell 2</p> </div> </div> <div class="row"> <div class="col-sm-6">
Viewing 15 lines of 24 lines. View entire code block.
instead of:
<div class="container"> <div class="row"> <div class="col-sm-12"> <div class="row"> <div class="col-sm-6"> <p>cell 1</p> <p>cell 1</p> <p>cell 1</p> <p>cell 3</p> </div> <div class="col-sm-6"> <p>cell 2</p> <p>cell 4</p> </div> </div>
Viewing 15 lines of 18 lines. View entire code block.
