Навигация и списки в таблице стилей сброса

Правильна ли эта таблица стилей сброса? Проблема, с которой я столкнулся, связана с OI и UL.

Как видите, ниже, где есть

 ol li, ul li {
    margin: 5px 0 0 40px;
   }

Я хочу применить его только к спискам на странице, это сработало, однако оно также применяет стиль к списку навигации! что в шапке, как я могу предотвратить это?

html, body, div, section, article, span, figure, figcaption, img, 
h1, h2, h3, h4, h5, h6, p, a, blockquote, pre, abbr, address, 
small, strong, sub, sup, input, output, textarea, ol, ul, li, fieldset, 
form, label, legend, tr, th, td, table, caption, footer, header, 
hgroup, aside, menu, nav, time, mark, audio, video, 
canvas, embed, iframe, object {

    margin: 0;
    padding: 0;
    border: none;
    font: inherit;
    max-width: 100%;
    text-decoration: none;
    box-sizing: border-box;
    -moz-box-sizing: border-box;    
    -webkit-box-sizing: border-box;
}

a {
    display: inline-block;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}

ol li, ul li {
    margin: 5px 0 0 40px;
}

abbr {
    font-weight: bold;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

.hidden {
    display: none;
}
Источник

2 ответа

Решение

Если есть li элементы в вашем nav Вы должны сбросить их снова или (лучше) вы должны указать, какие li элементы должны иметь эти поля. так что используйте для них класс.

 ol li.margined, ul li.margined {
    margin: 5px 0 0 40px;
 }

или первый вариант

ol li, ul li {
    margin: 5px 0 0 40px;
}
nav ol li, nav ul li {
    margin: 0;
}
Источник

Просто создайте более определенный класс, чтобы переопределить его, например,

ul.yourNavClass li {
   margin: 0px 5px;
}

Предполагается, что класс находится в элементе ul, так как я не вижу ваш код. Если это не так, просто измените его так, как он выложен, .yourNavClass ul li, или же nav ul li и т.п.

Источник
Другие вопросы по тегам