0

I could do 

<div class="row">
<div class="col-md-12"><h1>Title</h1></div>
</div>

<div class="row">
<div class="col-md-6">content</div>
<div class="col-md-6">content</div>
</div>

<div class="row">
<div class="col-md-12">content</div>
</div>

<div class="row">
<div class="col-md-12"><p>Some Text</p></div>
</div>

...

or

<div class="row">
<h1>Title</h1>
<div class="col-md-6">content</div>
<div class="col-md-6">content</div>
<div class="col-md-12">content</div>
<p>Some Text</p>
</div>

It would both result in the same output. When do I need to use rows? It it just "ugly" or for any reason wrong and not recommended?

kn1g
  • 358
  • 3
  • 16
  • 1
    Both don't show the same output: https://www.bootply.com/q4a9pOdgZ4 If you can see the content has negative margins in the second output. As mentioned in the [`doc`](https://getbootstrap.com/docs/4.1/layout/grid/): `Rows are wrappers for columns. Each column has horizontal padding (called a gutter) for controlling the space between them. This padding is then counteracted on the rows with negative margins. This way, all the content in your columns is visually aligned down the left side.` – m4n0 Jul 03 '18 at 01:16
  • See [this question](https://stackoverflow.com/questions/39960679/what-is-the-purpose-of-row-in-bootstrap) – StaticBeagle Jul 03 '18 at 01:22
  • But can I stack multiple COLs in one row or do I need to open a new row each time the sum is 12. Because it also works to stack let's say 4 col-md-12 in one row and they are displayed below each other like it should be... – kn1g Jul 03 '18 at 23:02

1 Answers1

0

You just need the row div around the col-6 columns. The other items (e.g the h1) will all go full width (if they are outside the row div), so no need for the col-md-12 div.

<h1>Title</h1>
<div class="row">
  <div class="col-md-6">content</div>
  <div class="col-md-6">content</div>
</div>
<div>content</div>
<p>Some Text</p>
Tom
  • 651
  • 4
  • 4
  • Ok, thanks. This in combination with the comment and bootply link provided by @Manoj makes sense. – kn1g Jul 03 '18 at 22:13