How do I get image to stay inside <div> border using float: right?

Hello;

I have got a problem trying to get a <div> tag to expand vertically when using css float: right; with an image.

With the code below the bottom of the image is below or outside of the border for the <div class=“newsArticle”> tag.


<html>
<head>
<style type="text/css">
div.newsArticle
{
border: 3px double #D3D3D3;
}
p.news
{
padding: 0px 0px 0px 0px;
margin: 0px 0px 0px 0px;
}
img.newsThumb
{
float: right;
border: 1px solid #D3D3D3;
}
</style>
<body>
				
				
<div class="newsArticle">
<a href="">Mary had a little lamb</a>
<p class="news">
<a href=""><img class="newsThumb" src="ThumbGetImage.gif" width="140" height="93" alt="Thumbnail"></a>
Its fleece was white as snow. Its fleece was white as snow.
</p>
</div>


</body>
</html>


Here’s a link to the page that shows my problem.
http://www.crer.biz/pages/news_type/LandingPageType.php?Result_Set=3&Type=2
Look at the second picture down and you can see what I’m talking about.

I would appreciate any assistance that anyone might provide.

Thanks.

I think, if you apply float:left; to div.newsArticle it should fix the problem…

Let me know if it works… :slight_smile:

Good old clear :slight_smile:

<html>
<head>
<style type="text/css">
div.newsArticle 
{
border: 3px double #D3D3D3;
}
p.news
{
padding: 0px 0px 0px 0px;
margin: 0px 0px 0px 0px;
}
img.newsThumb 
{
float: right;
border: 1px solid #D3D3D3;
}
.clear { clear: both; }
</style>
<body>

              
<div class="newsArticle">
<a href="">Mary had a little lamb</a>
<p class="news">
<a href=""><img class="newsThumb" src="ThumbGetImage.gif" width="140" height="93" alt="Thumbnail"></a>
Its fleece was white as snow. Its fleece was white as snow.
</p>
<div class="clear"></div>
</div>


</body>
</html> 

Wow! I justed tested both adding float:left; to div.newsArticle and .clear { clear: both; }.

They both work great!

It had me worried. I wasn’t sure I was going to be able to fix the problem without re-working a whole bunch of things.

Thanks for the help.