I am running into issues trying to align and float certain divs properly.
Currently, I have two divs with images that are displaying correctly, and now I need to add two more divs with images that behave in the same way.
Even though I attempted to use the same code that worked for the existing divs, the new ones keep positioning themselves within the same container as the other images I am working with.
//Below 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>
The goal is to display these inline, obviously.
So, I attempted the following.
<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>
Ultimately, my intention was to replicate the previous layout to achieve a similar result, but the new image keeps getting grouped with the top image in the same div.
Would greatly appreciate any assistance on this matter. Thank you kindly.
~zaklikescode