Проблема с плавающей кнопкой в ​​IE7

Question

У меня проблема в IE7 для формы регистрации, которую я сделал для этого сайта, и она только портится внизу и встречается только в IE7.Это страница с проблемой:

https://www.iptlock.com/createaccount.php

Переключатели внизу этой страницы отображаются в обратном порядке.Я настроил их в CSS, как это, но это не так, как они отображаются.Есть идеи почему?

    #packagechoice{
        width:20px;
        position:relative;
        margin-left:190px;
        margin-top:15px;
        float:left;
    }

    #packagechoice2{
        width:20px;
        position:relative;
        margin-left:190px;
        margin-top:15px;
        float:left;
    }
    #packagechoice3{
        width:20px;
        position:relative;
        margin-top:15px;
        float:left;
}

Answer 1

При использовании float:left крайний левый элемент должен появляться первым в вашем HTML. Ваш HTML в обратном порядке.

EDIT:

Проблема с вашим HTML заключается в том, что переключатели и пакеты являются отдельными позициями. Они кажутся отдаленными в HTML. Ваш код также страдает от DIV-Itis. Ему не хватает семантической структуры, поэтому вещи не взаимодействуют так, как вы ожидаете.

Учтите это:

<style>
.packages ul, .packages li {
    list-style:none;
    padding:0;
    margin:0;
}

.packages li {
   float:left;
}

.clear {
    clear:both;
}
</style>

<div class='packages'>
    <ul>
        <li>
             --- your package ---
             --- your radio button ---
        <li>
        <li>
             --- your package ---
             --- your radio button ---
        <li>
        <li>
             --- your package ---
             --- your radio button ---
        <li>
   </ul>
   <div class="clear"></div>
</div>

Вещи, которые идут вместе, СПИСКИ. В HTML уже есть тег списка: UL или OL, его правильное использование важно и является отличным способом устранения DIV-itis. Списки имеют смысловой смысл и более удобны для поисковых роботов и программ чтения с экрана.

Есть отличная статья о списках укрощения .

Понимание того, как эффективно использовать списки, - это разница между кем-то, кто является хаком, и тем, кто является профессионалом. УЧИТЕ ЭТО.