Проблемы с позиционированием IE

В каждом браузере, кроме IE, на euroworker.no/order маленькая зеленая стрелка под словом «produkt» сидит поверх моего контейнера div. Почему в мире это не работает в IE? Дело в том, что он работает на двух страницах из четырех в IE, но все четыре в других браузерах. Все страницы построены одинаково, но для IE он отображает эту вещь, как 20px выше roundbigbox.Проблемы с позиционированием IE

Любые идеи парней?

Doctype:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

CSS для верхнего индикатора prgress:

#checkoutProgress 
{ 
    width: auto; 
    padding-top: 1em; 
    height: 30px; 
    overflow:hidden; 
    font-family: "Helvetica"; 
    font-size:18px; 
    float:left; 
/* margin-bottom:22px;*/ 
    margin-left:0px; 

} 

#checkoutProgress a 
{ 
    padding: 10px; 
    /*border-width: 2px; 
    margin-right: 20px;*/ 
    text-decoration:none; 
    font-size: 17.26px; 
    color:#dadada; 
    text-transform:uppercase; 

} 

#checkoutProgress a:hover 
{ 
    padding: 10px; 
    /*border-width: 2px; 
    margin-right: 20px;*/ 
    text-decoration:none; 
    font-size: 17.26px; 
    color:#818072; 

} 

/* completed steps */ 
#checkoutProgress a.completed 
{ 
    border-color: #70D66D; 

} 

/* current step */ 
#checkoutProgress a.active 
{ 
/* border-color: #ADD8E6;*/ 
    font-weight: bold; 
/*background-color: #fffccc; 
border-color: #ADD8E6;*/ 
background-image:url(../../upload/urhere_arr.png); 
background-position:bottom center; 
/*padding-left:15px;*/ 
color:#a3a398; 
}

Для коробки:

div #roundbigbox { 
    background-image:url(../../upload/EW_p_og_L.png); 
    background-position:top center; 
    background-repeat:no-repeat; 
    padding:5px; 
    padding-top:10px; 
    padding-bottom:0px; 
    width:760px; 
    height:1%; 
    border-width:1px; 
    border-color:#dddddd; 
    border-radius:10px; 
    -moz-border-radius:10px; 
    -webkit-border-radius:10px; 
    z-index:1; 
    position:relative; 
    overflow:hidden; 
    margin:0; 
    margin-bottom:10px; 
    }

FIELDSET Css:

fieldset.container 
{ 
    border: 0; 
}

И некоторые HTML:

<fieldset class="container"> 

    <div id="checkoutProgress" class="progressCart"> 

       <a href="/order" class=" active" id="progressCart"><span>Produkt</span></a> 
       <a href="/checkout/selectAddress" class="completed " id="progressAddress"><span>kunde info</span></a> 


       <a href="/checkout/shipping" class="completed " id="progressShipping"><span>Leveringsmåte</span></a> 

       <a href="/checkout/pay" class="" id="progressPayment"><span>Betaling & Fullfør</span><</a> 
      </div> 

    </fieldset>   </div> 



       <form action="/order... > 

    <input type="hidden"...> 
    <div id="roundbigbox"> 
    <p id="pro">Produkter</p> 
    More content 

    </div>

источник

2010-04-09 Kyle

Ваш HTML-фрагмент выглядит плохо формируется, есть пара заканчивается, и закрывающие теги, которые не имеют матч!

Первое, что нужно сделать, это проверить ваш XHTML (очень важный в строгом doctype) с помощью w3c validator. Еще одна вещь, которую нужно искать в IE - это случайные пробелы - не спрашивайте меня, почему, но постарайтесь убедиться, что нет посторонних пробелов. Я думаю, что такое «случайное» поведение в IE обычно имеет источник в этих проблемах.

источник

2010-04-09 08:55:24 dmp

Просто посмотрел на ваш сайт - у вас также есть ряд проблем с z-индексированием. Определенно пора нажать на валидатор! :) – dmp

Идея! Я сделаю именно это. – Kyle

Ну, похоже, мой mac просто разбился, поэтому никаких изменений не будет сделано сейчас, спасибо в любом случае. – Kyle

Проблемы с позиционированием IE

ответ

Смежные вопросы