Alignment issue with IE.....

[tamilsweet]

Please have a look at the attached Image.
The alignment is not proper in IE but looks fine in FF and Opera.

The line with text "New Articles" should be in same line as the two images.

HTML

<div style="clear:both"></div>
<div id="new_articles_left"></div>
<div id="new_articles_right"></div>
<div id="new_articles_middle" class="title_white newsheadtext">New Articles</div>


CSS

#new_articles_left {
background-image: url(/img/outside_20.gif);
float: left;
width: 28px;
height: 32px;
}
#new_articles_middle {
background-color: #76899A;
padding-left: 50px;
padding-top: 10px;
width: 375px;
height: 22px;
}
#new_articles_right {
background-image: url(/images/outside_22.jpg);
background-color: #76899A;
float: right;
width: 24px;
height: 32px;
}

[abduraooft]

No way to see the effect without those images. Could you post a link ?
(I get the following after giving borders around them)

[abduraooft]

http://www.positioniseverything.net/explorer/doubled-margin.html may help!

[tamilsweet]

Hi,
Thanks for the help.
display: inline; doesn't helped fix the issue.

I changed the padding to margin and got the desired alignment.

Changed,
padding-left: 50px;
to
margin-left: 28px; /* width of the left side image */
padding-left: 22px;

[tamilsweet]

Have a look at the image.
Read some where about this issue and the fix to solve this but forgot.

The Divs L1, L2 & L3 have
float: left;
clear: both;

The Divs R1, R2 & R3 have
float: right;

In FF Left and Right Divs are aligned inline.
In IE its not so...

Sorry for the question without any code or link ;)

[abduraooft]

Huh? you have to post a link or complete code here!