Ранее мы уже рассказывали о сбросах для кода CSS и практике по обнулению всех значений браузера по умолчанию или подразумевающихся значениях для свойств CSS. В целом мы против сбросов для кода CSS, которые «уничтожают» абсолютно все: на наш взгляд такой подход с использованием огромного количества селекторов для обнуления требует слишком много работы. Так что нам больше нравится умеренный, расчетливый подход, который нацелен на задание значений только тем селекторам, с которыми могут возникнуть проблемы.

Далее расположен набор объявлений CSS, который решает большинство таких проблем во всех браузерах. Набор правил содержит и расширяет тот предыдущий сброс для кода CSS, о котором мы рассказывали раньше. Не стесняйтесь добавлять и изменять эти правила по необходимости: мы бы только попросили оставить комментарий с припиской об авторстве, как полагается по лицензии Creative Commons.

/* Таблица стилей для сброса кода – 1 Января, 2015 http://thenewcode.com/300/CSS3-HTML5-Stylesheet-Reset */
html {
        box-sizing: border-box;
}
*, *:before, *:after {
        box-sizing: inherit;
}
body {
        min-height: 100vh;
}
body, ul, ol, dl, figure {
        margin: 0;
}
textarea {
        resize: vertical;
}
input[type="submit"]::-moz-focus-inner,
        input[type="button"]::-moz-focus-inner {
                border : 0px;
}
input[type="search"]{
        -webkit-appearance:textfield;
}
input[type="submit"] {
        -webkit-appearance:none;
}
/* опционально */
.right {
        float: right;
        margin-left: 2rem;
        clear: right; }
.left {
        float: left;
        margin-right: 2rem;
        clear: left;
}
table {
        border-collapse: collapse;
}
th {
        background: #000;
        color: #fff;
}
td {
        padding: 1em;
        border: 1px solid black;
}

Дополнительная информация: нам также нравится подход в таблицах стилей для сброса кода normalize.css и Base CSS, которые стараются задать одинаковые стили по умолчанию для всех браузеров, а не «рушить все до основания».

Автор урока Dudley Storey

Перевод — Дежурка

Смотрите также: