Michael Michael - 6 months ago 11
CSS Question

HTML Content over flowing bootstrap containers

I have a page with some bootstrap wells: http://jsfiddle.net/LmwbkLo6/

<div style="margin:15px;">
<br>
<div class="well">
<div class="col-sm-8">
<h4>Test Title</h4>
<p>Some test text</p>
<p>More text..</p>
</div>
<div class="col-sm-4">
</div>
<p>And Some Text Here
<p>
</div>
</div>


Im having an issue with the content overflowing the parent containers.

For Example, the content here is overflowing the Well div. I can "fix" this by adding
class="col-xs-12"
to the Well Div, but then the div itself will overflow the outer div.

Does anyone have any Ideas?

Answer

You need to wrap your class="col-* divs in <div class="row"></div> or it will not apply the negative margin.

Comments