David Young David Young - 1 year ago 81
CSS Question

Bootstrap CSS undesired overlapping elements

I'm typically more of a backend guy, but I find myself working on a project that requires some frontend work. I'm fumbling my way through using bootstrap, and I find myself stuck on the following:

<div id="form" class="col-md-6">
<!-- form goes here -->
<br /> <!-- multiple br tags do nothing, as long as col-md-6 is used above -->
<div id="image_container">
<image src="myimage.jpg" />

I want a gap between the end of the form and the top of the image, but
seems to be resulting in there being overlap, and the image-div is vertically larger than it is on the same page with

Admittedly, CSS has never been my forté, but I'm hoping to address that soon. In the meantime, can someone help me out with this issue?

Answer Source

Seems you're not using the grid system correctly, you have to use rows and cols to separate your elements in your frontend.

Check this link about Bootstrap Grid System