Наследование селектора якоря IE

Question

У меня есть HTML с базовой структурой

<nav>
     <div>
    <a href="">
        <div class="navlink" data-link="home">
            <span class="top"></span>
        </div>
    </a>
    <div id="index-03"></div>
    <a href="">
        <div class="navlink" data-link="resume">
            <span class="top"></span>
        </div>
    </a>
        ...
     </div>
</nav>

и CSS вроде этого

a {
    color: #000;
}

div.navlink span {
    background: red;
}

nav {
    position: relative;
    margin: auto;
    width: 1000px;
    right: 35px;
    color: #fff;
}

nav span {
    margin:auto;
    text-align: center;
    position: absolute;
    width: 100%;
    color: #fff;
    font-weight: bold;
    text-transform: uppercase;
}

nav span.top {
    top: 45%;
    font-size: 24px;
    color: #fff;
    z-index: 50;
}

nav span.bottom {
    top: 41%;
    font-size: 16px;
    z-index: 50;
    color: #fff;
}

.navlink:hover {
    cursor: pointer;
    z-index: 50;


   color: #fff;
}

В каждом браузере я могу протестировать, но в IE 6-8 работают позиция и цвет для диапазона .navlink, но в IE он применяет самый высокий родительский селектор a {}. Это не имеет смысла для меня, как сделать так, чтобы положение и цвет применялись к диапазону во всех браузерах, включая IE

Answer 1

IE 6-8 не поддерживает тег <nav>.Вы должны использовать код JavaScript, такой как this , чтобы включить стилизацию новых тегов html5 или придерживаться тегов div.

Answer 2

Поскольку <nav> является элементом HTML5, IE6 до 8 не распознает его.Ваши стили не будут применены к элементам, которые он не распознает как настоящие элементы DOM.

Вам необходимо сообщить IE о наличии элементов HTML5 с помощью чего-либо, такого как HTML5 shiv .

Мой единственный вопрос: что произойдет в IE, если JS отключен, тогда?

Я думаю, что вы в значительной степени облажались.