2
Contributors
3
Replies
12
Views
4 Years
Discussion Span
Last Post by JorgeM
0

The reason why this is occurring is because you applied a float:left to the image. The float takes the image outside of its normal flow. Therefore, its not part of the height of the parent div element. A quick fix is to apply a clear:both right before the closing </div> tag. You can also use the clearfix method.

For example...

<div class="box_data photo_listing">
<a href="picture/view/2/Fiskars+Garden+Bucket+Caddy.html" target="_blank">
<img src="uploads/shop/76498-41ESVX7QBEL._SY450_.jpg" height="200px" width="200px" alt="Fiskars Garden Bucket Caddy" style="float: left;"></a>
<p>The 9424 Garden Bucket Caddy by Fiskars makes it easy to carry all of your essentials when you're out in the garden. It fits snugly on a five-gallon bucket, freeing up the internal space for dirt, yard waste or supplies. Deep, large pockets provide ample space for tools, gloves, beverages and even a cell phone. Sturdy canvas construction is light, durable and easy to clean. The Bucket Caddy has a Lifetime warranty.</p>
<p>
- Ideal for transporting a variety of small tools, beverages, your cell phone and more<br>
- Frees up internal bucket space for yard waste or other items<br>
- Includes nine deep pockets and two "pencil" pockets<br>
- Durable, easy-to-clean canvas construction offers lasting value<br>
- Fits five-gallon buckets (bucket and tools not included)</p>
<div style="clear:both"><div>
</div>

Edited by JorgeM

0

Thanks, I tried applying it to a parent element thinking it'd work there too but applied your sugguestion and it worked without a second thought.

Thank you!

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.