Change css attribute for IE6

programming web dev
1

Hi everyone I have a problem someone might be able to help me with. I designed a site
for a friend and it looks great in IE7 and on safari or firefox. But in IE6 the margin is slightly off. I tried entering the following in the header of my page where I want to adjust the class if the enduser is using IE6

Here is what I have in my header to fix the IE problem but it doesnt adjust the margin:



<!--[if lt IE 6]>
<style type="text/css" media="screen">
.presidentSection
{
	margin:0 0 0 100px;
}
</style>
<![endif]-->

This is what I have in my main.css which works fine in IE7 and firefox



.presidentSection
{
	padding:0;
	margin:0 0 0 180px;
	height:296px;
	width:167px;
	float:left;
}

This is the xhtml that I am trying to correct:



<!-- pres section -->
            <div class="execRowTop">
            <div class="presidentSection"><img src="images/exec_board/name.jpg" />
                <div class="committeTitleContainer">
                    <h4>President</h4>
                    <br />
                    <a href=""><img src="images/content/mail_icon.gif" class="mailIcon" /></a> <span class="name">Name</span>
            </div>
            </div>
            </div>

Any help is appreciated, I am thinking I am not targeting the div correctly. can anyone help please.