Ok this has to be an easy fix I can't find what I am looking for though. I have searched on conditional comments and tried some out, but to no avail.
The issue is in IE7...the padding I used for my nav has pushed the flash image rotator down the same amount. I don't know if it has something to with my css or my clients flash coding (I'm assuming my css since it works in every other browser) You can visit the site http://rjmccollam.com/test
<object classid=\"clsid:D27CDB6E-AE6D-11cf-96B8-444553540000\" width=\"802\" height=\"404\" hspace=\"0\" vspace=\"0\" align=\"top\" id=\"FlashID\"> <param name=\"movie\" value=\"Home_Slideshow.swf\" /> <param name=\"quality\" value=\"high\" /> <param name=\"wmode\" value=\"transparent\" /> <param name=\"swfversion\" value=\"8.0.35.0\" /> <!-- This param tag prompts users with Flash Player 6.0 r65 and higher to download the latest version of Flash Player. Delete it if you don’t want users to see the prompt. --> <param name=\"expressinstall\" value=\"Scripts/expressInstall.swf\" /> <!-- Next object tag is for non-IE browsers. So hide it from IE using IECC. --> <!--[if !IE]>--> <object data=\"Home_Slideshow.swf\" type=\"application/x-shockwave-flash\" width=\"802\" height=\"404\" hspace=\"0\" vspace=\"0\" align=\"top\"> <!--<![endif]--> <param name=\"quality\" value=\"high\" /> <param name=\"wmode\" value=\"transparent\" /> <param name=\"swfversion\" value=\"8.0.35.0\" /> <param name=\"expressinstall\" value=\"Scripts/expressInstall.swf\" /> <!-- The browser displays the following alternative content for users with Flash Player 6.0 and older. --> <div> <h4>Content on this page requires a newer version of Adobe Flash Player.</h4> <p><a href=\"http://www.adobe.com/go/getflashplayer\"><img src=\"http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif\" alt=\"Get Adobe Flash player\" width=\"112\" height=\"33\" /></a></p> </div> <!--[if !IE]>--> </object> <!--<![endif]--> </object>
If I remove the padding, nothing changes in firefox. Did you try it? It looks like you have to much padding, that's why I suggested removing it. A little trial and error and you should get it. Otherwise, pack up you code and image s so we can play with it to try and fix it.
That did the trick! Thank a lot for your help. Is this because I have padded the nav and since the home-flash is positioned below the nav it is padded as well? (if that made sense)
I don't know why it happened, there is to much code to look through. When I looked in firefox, the site looked fine. When I looked in I.E, it was sitting to low. I used firebug to remove the padding and the flash didn't move, That's why I suggested removing the padding on that one element. If you don't have firebug, you should get it
The issue is in IE7...the padding I used for my nav has pushed the flash image rotator down the same amount. I don't know if it has something to with my css or my clients flash coding (I'm assuming my css since it works in every other browser) You can visit the site http://rjmccollam.com/test
here is the html:
...and the css:
#home-bg {
background:url(../images/homebg.jpg) no-repeat top center;
height: 768px;
margin-top: 50px;
}
#home-icons {
background: url(../images/homeiconsbg.jpg) no-repeat top center;
height: 181px;
}
#home-flash {
width: 802px;
height: 404px;
padding-top: 239px;
padding-right: 5px;
}
ul#nav {
float: left;
padding-top:211px;
padding-left: 160px;
}
ul#nav li {
display: inline;
}
ul#nav li a {
display: block;
float: left;
height: 28px;
text-indent: -9999px;
}
ul#nav li.about a {
width: 65px;
background: url(../images/about.png) bottom center;
}
ul#nav li.loire a {
width: 124px;
background: url(../images/loire.png) bottom center;
}
ul#nav li.provence a {
width: 106px;
background: url(../images/provence.png) bottom center;
}
ul#nav li.bordeaux a {
width: 108px;
background: url(../images/bordeaux.png) bottom center;
}
ul#nav li.tour a {
width: 180px;
background: url(../images/tour.png) bottom center;
}
ul#nav li.reserve a {
width: 122px;
background: url(../images/reserve.png) bottom center;
}
ul#nav li a:hover{
background-position: top center;
}
/* End Navigation */
s so we can play with it to try and fix it.