PDA

View Full Version : Internet Explorer Problem position absolute with margins



Caldwell5161
03 Aug 2009, 04:58 PM
Once again, internet explorer has destroyed my design.

So I have several divs positioned absolute with a margin to move them over an image. They are displayed none and appear with a mouseover with jquery. It works great in Firefox and Safari, but internet explorer displays the divs far to the right of the centered website content. And I cannot figure out why.

Here's some sample code:

<div class="tourInput1">
<div class="tourInput1Content" id="tourInput1Content">
Input #1 ¼” Mono TS Instrument Unbalanced
</div>
</div>

.tourInput1 {
background:url(images/arrowLeft.png) 0% 40% no-repeat;
position:absolute;
margin:215px 0px 0px 375px;
display:none;
}

.tourInput1Content {
background:url(images/tourInputBG.png) top repeat-x #001950;
border:#FF9900 1px solid;
margin-left:15px;
padding:12px;
}

I can't for the life of my figure it out. Any help would be greatly appreciated.