通过浮动向右对齐Divs

Question

Im having trouble getting some divs to float and align properly.

I have two divs that contain images that are working properly, and I need to add two more, with images that behave the in the same manner.

I tried to use the same code to make the current divs work properly, but they automatically seem to remain allocate themselves within the same div as the other images that I'm trying to use.

//Here is the Code.

<div id="products">
        <img src="cbdog.jpg" style="float: left; padding-bottom: 25px;">
        <br>
        <br>
    </div>
    <div id="otherProducts">
        <br>
        <br>
    <img src="gelog.jpg" style="float: left;">
    </div>

Im trying to this is inline obvisouly.

So I tried to do.

<div id="products">
        <img src="cbdog.jpg" style="float: left; padding-bottom: 25px;">
        <br>
        <br>
    </div>
    <div id="otherProducts">
        <br>
        <br>
    <img src="gelog.jpg" style="float: left;">
    </div>
<div id="cbdGel">
        <br>
        <br>
    <img src="gelog.jpg" style="float: left;">
    </div>

And Basically replicate the previous formatting to get the same result, but the resulting image just places itself with the same div as the top image.

Any help would be greatly appreciated. Thanks in advance.

~zaklikescode

Answer 1

If i understand correctly, you want two divs side by side? if so. You'll need to assign a width and position either inline using the style="" attribute or in css

#products, #otherproducts { float:left; width:48%; position:absolute; }

if not, let me know. I'll see what i can do.