Right align Div within larger Div

[TheCandyman]

I need to right align a div within another(larger) div and have text flow around it. Currently, the display works correctly in FF but not in IE. The larger div contains an image and text, the smaller div highlighted items. The text wraps around the smaller div in FF but in IE it waits until after the smaller div is finished then displays which leaves a lot of empty space. I have struggled with this for a few days, any suggestion would be great!

CSS

#right p.rightTop{
	display:block;
	background:url(../images/right_top.gif) 0 0 no-repeat;
	width:608px;
	height:26px;
}
#right3{
	font-family:Tahoma, Verdana;
	font-size:13px;
	padding:0 20px 20px 0;
	width:940px;
	float:left;
}
#right3 div.rightTxt2{
	font:normal 13px/18px Tahoma, Verdana, Arial;
	color:#62625C;
	background-color:inherit;
	padding:0 0 20px 38px;
	width:890px;
	margin:0 27px 0 0;
	display:inherit;
	text-align:left;
}
#rightsmall{
	background-color:#CCCCCC; 
	padding:15px; 
	float:right !important; 
	display:inline; 
	font-family:Tahoma, Verdana;
	font-size:13px;
}

HTML

<div id="right3">
    <p class="rightTop"></p>
    <span id="rightsmall">
        <h3>Upcoming Sponsored Events</h3>
        <br /><br /><br /><br /><br /><br />
    </span>
    <h2>Monthly Presidents Message</h2>
    <div class="rightTxt2"> Text text text ....</div>
</div>

 

[Vragabond]

I would suggest you remove the width from .rightTxt2, but then again, I could suggest you to remove most of the code you have. All you need is [tt]float: right;[/tt] on #rightsmall. If you need more of a gap, then add margins to this element as well. All else should fall into place on its own then.

___________________________________________________________
[small]Do something about world cancer today: Comprehensive cancer control information at PACT[/small]

 

[TheCandyman]

That width was the problem, thanks for the extra eyes!