Jump to content

Еще одна тема про reset.css


advokatua
 Share

Recommended Posts

 

Нету вреда, это вопрос религии грамотный ресет ничего не портит. Мне тоже обратного доказать никто не смог  

 

Это не вопрос религии, а вопрос здравого смысла. Я уже 100500 раз говорил, скажу ещее раз. Ресет это бесполезный кусок стилей. Объяснял это я тоже 100500 раз. Normalize, по сути тоже весьма бесполезен, но в нем хотя бы смысла заведомо больше заложено. Если именно сам Normalize адаптировать под конкретный проект, а не просто кидать как есть и потом все переопределять, то еще куда ни шло.

 

лично я так и делаю беру normalize и подгоняю под проект и в итоге получаю полезный кусок css 

Link to comment
Share on other sites

Да и с большими проектами тоже самое. Ну не нарисовал дизайнер особый стиль для всех списков - но и обычные точечки, кругляшки - дизайн не испортят - будут выглядеть вполне терпимо и заказчика в 80% случаев они устроят, их не попросят адаптировать под дизайн.

 

Я бы такого дизайнера уволил. Он работает не в полиграфии, а с WEB, а WEB - живой. Если у дизайнера устройство мозга не позволяет подумать о том как его дизайн будет вести себя в динамике, то нам с таким дизайнером не по пути. Это опять же не проблема ресета, это проблема криворукого дизайнера.

 

Это не вопрос религии, а вопрос здравого смысла. Я уже 100500 раз говорил, скажу ещее раз. Ресет это бесполезный кусок стилей.

 

Я приведу пример ресета, а ты взгляни на него и скажи, ситаешь ли ты его таким уж бесполезным, договорились?

button {  position: relative;  overflow: visible;}button::-moz-focus-inner {  padding: 0;  border: 0;}
Link to comment
Share on other sites

Я приведу пример ресета, а ты взгляни на него и скажи, ситаешь ли ты его таким уж бесполезным, договорились?
button {  position: relative;  overflow: visible;}

pos:r - бывает нужен по ситуации, но далекоо не всегда.

ov:v - бессмысленная запись, ибо оно и так visible по-умолчанию, да и необходимости переопределять это свойство, даже чем-то другим, совершенно нет.

button::-moz-focus-inner {  padding: 0;  border: 0;}

Да полезное свойство, но снова таки, в 95% случаев спокойно обходится и без него, в оставшихся случаях оно сугубо индивидуально подстраивается под конкретный тип кнопок. Так что обобщать это незачем, но иногда бывает полезно, да.

 

Давай дальше :)

Link to comment
Share on other sites

pos:r - бывает нужен по ситуации, но далекоо не всегда. ov:v - бессмысленная запись, ибо оно и так visible по-умолчанию, да и необходимости переопределять это свойство, даже чем-то другим, совершенно нет.

Это ващет фиксы для ИЕ. Я конечно понимаю, что тебя давно уже всё что ниже 9 не интересует, но не всем так везёт. 

 

UPD: Сравни в ИЕ7 и ИЕ9 без переназначения overflow.

<button style="width: 100px;">some test button</button>
Link to comment
Share on other sites

Это ващет фиксы для ИЕ. Я конечно понимаю, что тебя давно уже всё что ниже 9 не интересует, но не всем так везёт. 

Отсутствие этих свойств у меня не вызывало проблем в IE8- никогда, прям вообще.

 

Конкретно для кнопок почему-то это не совсем так в IE9-10.

Ну да, в IE11 тоже hidden, вместо visible, если бы ты не сказал, я бы и не вспомнил об этом, ибо проблем это не доставляет. Кнопки с вылезающими за границы иконками не часто встречаются (может это мне так везет, конечно), но если и встретится, то ничего не мешает добавить это свойство. Зачем его постоянно таскать за собой по всюду, я не очень понимаю

Link to comment
Share on other sites

Зачем его постоянно таскать за собой по всюду, я не очень понимаю

Вот в данном случае, имхо, вреда от этих строчек всяко меньше, чем возможной пользы (напр. переносимости одного и того же стиля и для ссылок, и для кнопок). Но я бы не назвал это ресетом. Вариант кастомного нормалайза — возможно. Но по мне это просто часть своей библиотечки полезных хаков, наряду с клирфиксом-шмирфиксом и т.п. :)

 

Вот однозначно вредным в популярных ресетах я считаю переопределение border-collapse у таблиц. Да, это убирает зазоры между ячейками в IE7-, но мешает, например, слёту закруглить углы у ячеек...

Link to comment
Share on other sites

А у меня вызывало, что дальше? 

 

Мне интересно посмотреть на пример с проблемой. Правда у меня IE11, все остальное в режиме эмуляции :) А не, есть IE8 на vbx

 

Вот в данном случае, имхо, вреда от этих строчек всяко меньше, чем возможной пользы (напр. переносимости одного и того же стиля и для ссылок, и для кнопок). Но я бы не назвал это ресетом. Вариант кастомного нормалайза — возможно. Но по мне это просто часть своей библиотечки полезных хаков, наряду с клирфиксом-шмирфиксом и т.п.

 

Ну в целом, да. Я как-то сильно категорично выразился. И да это уже не ресет, а кастомный нормалайз, типа 

 

 

 

Вот однозначно вредным в популярных ресетах я считаю переопределение border-collapse у таблиц. Да, это убирает зазоры между ячейками в IE7-, но мешает, например, слёту закруглить углы у ячеек...

 

Таблички в ресетах, это вообще боль и глубокая травма :) Это принесло оооочень много проблем, в свое время, пока не отказался от этого. И не только с округлением углов

Link to comment
Share on other sites

Но я бы не назвал это ресетом. Вариант кастомного нормалайза — возможно.

Это уже вопрос терминологии. Я это называю ресетом.

 

Мне интересно посмотреть на пример с проблемой.

Я же показал пример, этого недостаточно? 

Link to comment
Share on other sites

Это уже вопрос терминологии. Я это называю ресетом.

Мне кажется все же стоит различать эти вещи, подходы к вопросу как бы разные :)

 

Я же показал пример, этого недостаточно? 

А где? я что-то не увидел. А пардон, ты пост обновил, я не заметил

Link to comment
Share on other sites

Имхо, ресет — это «ковровое» обнуление нормальных свойств элементов, типа жирности у b/strong или полей у p, для всех случаев. Это бывает полезно в навороченных макетах из разношерстных неповторяющихся блоков, но чаще оказывается лишним действием. А тут именно браузероспецифичные хаки, не меняющие привычного поведения элемента в целом, но сглаживающие мелкие разночтения.

  • Like 1
Link to comment
Share on other sites

alexriz, SelenIT, у вас сплошные "имхо" и "мне кажется", я же говорю, это вопрос терминологии :)

Поля у блоков я, например, тоже вписываю в ресет, мне потом проще контролировать вертикальный ритм (я не про такой крутой ритм, мой попроще):
 

h1, h2, h3, h4, h5, p {  margin: 0 0 10px;} 
Link to comment
Share on other sites

Так правильно, именно так и должно быть.

 

Неправильно делать так:

/* reset.css */h1, h2, h3, h4, h5, p {  margin: 0;}/* main.css */h1, h2, h3, h4, h5, p {  margin: 0 0 10px;}

А у большинства кто использует сброс Мейера именно такая ситуация и получается

Link to comment
Share on other sites

По-моему логичнее делать так margin :10px 0 - схлопывающиеся отступы и все такое)...

Схлопывающиеся отступы чаще мешают чем помогают. Вот лично мне. Но упираться тут не буду, каждый делает так как удобно ему. Если вам и сверху и снизу удобней, то делайте на здоровье.

Link to comment
Share on other sites

Great Rash, кстати, в твоем примере overflow: visible; дает не тот результат который бы хотелось, собственно это и понятно. В данном случае тут проблема не в overflow, а в том, что старые IE не умеют переносить текст в кнопке. (по крайней мере в эмуляторе не хочет ни под каким видом)

 

h_1386760083_6282996_1817df71dd.png

 

 

 

h1, h2, h3, h4, h5, p { margin: 0 0 10px; }

По-моему логичнее делать так margin :10px 0 - схлопывающиеся отступы и все такое)... 

 

Мне тоже кажется это более правильным, учитывая что и браузеры используют этот подход по-умолчанию. Но дзен двухсторонних маргинов мне пока что не поддался в полной мере. Так как верхний маргин доставляет проблемы в крайних позициях, когда контактирует с границей своего родителя. Так что я пока склонен применять вариант товарища Great Rash. Но экспериментирую и с двухсторонними маргинами

Link to comment
Share on other sites

А у большинства кто использует сброс Мейера именно такая ситуация и получается

Дык я то пытаюсь втолковать, что речь о правильном ресете. Я даже не пытаюсь никого убеждать, что мой самый лучший. Каждый его сам для себя вырабатывает со временем. Но утверждать, что ресет - это однозначное зло я тоже не берусь.

 

кстати, в твоем примере overflow: visible; дает не тот результат который бы хотелось

У меня в режиме ИЕ7 та же фигня, странно. Ну ладно у меня есть еще один пример из жизни:

<button>  <span style="width: 100px;">some test button</span></button><br><button style="overflow: visible;">  <span style="width: 100px;">some test button</span></button>
Link to comment
Share on other sites

Дык я то пытаюсь втолковать, что речь о правильном ресете. Я даже не пытаюсь никого убеждать, что мой самый лучший. Каждый его сам для себя вырабатывает со временем. Но утверждать, что ресет - это однозначное зло я тоже не берусь.

Значит мы друг друга неправильно поняли. Я о своем css по-умолчанию, тоже ни слова не сказал, тут каждый волен собрать тот вариант который ему более удобен. Я всего лишь пытался донести, что сначала обнулять стили, а потом снова их определять это бредок :)

Link to comment
Share on other sites

По мне так лучше от "нулей" переопределять, разве нет?(имхо)

А какая разница как переопределять? Оно же переопределится :) В смысле если я напишу margin: 5px; какая разница чо там было до того, нули или цифры какие-то? Оно же и так и так 5px станет. 

Link to comment
Share on other sites

А какая разница как переопределять?

 

Ранее уже обсуждалось в чем разница. Книжка у "Apart" есть, там человек доступно этот момент описывает.

Вот интересно - некоторым людям не нравится когда кто-то обнуляет элементы, что по сути буквально мало на что влияет, но им нравится БЭМ, который нарушает всю логику CSS. Одно дело переопределить элемент, а другое дело отходить от каскадности - основной логики CSS. 

 

Давайте тогда обсудим FLOAT, который изначально создан исключительно для работы с текстом. Но кто-то решил, что им можно (и корректно) создавать колонки и понеслась. Это типа не ошибка (причем фактически для всех), а переопределить элемент это глупо и ламерски? Если не ошибаюсь, в спеке по флоат нет ни единого примера где приводится способ его использования для построения макета из колонок. 

Link to comment
Share on other sites

Давайте тогда обсудим FLOAT, который изначально создан исключительно для работы с текстом. Но кто-то решил, что им можно (и корректно) создавать колонки и понеслась.

Никто не говорит, что строить лейаут на float это корректно, а те кто так говорит просто что-то не то съели прочитали. Проблема тут лежит в другом, что до недавнего времени не было специальных методов для построения именно лейаута, следовательно разработчики крутились как могли.

 

Ранее уже обсуждалось в чем разница. Книжка у "Apart" есть, там человек доступно этот момент описывает.

Ну так давай цитату, что ты там вычитал и обсудим, не вопрос :)

 

Вот интересно - некоторым людям не нравится когда кто-то обнуляет элементы, что по сути буквально мало на что влияет, но им нравится БЭМ, который нарушает всю логику CSS. Одно дело переопределить элемент, а другое дело отходить от каскадности - основной логики CSS. 

Начнем с того, что css не навязывает каскадность, так же как БЭМ не навязывает отказ от нее же. Мне допустим БЭМ тоже не очень то по душе, но заложенный в него принцип независимых блоков позволяет решать ряд задач, которые с применением излишней каскадности решать по меньшей мере неудобно.

Link to comment
Share on other sites

ак же как БЭМ не навязывает отказ от нее же

Вообще основной принцип классического Бэма - полный отказ от каскадности 1 тег с оформлением = 1 класс независимо от вложенности, никаких вложенных тегов в css.

Link to comment
Share on other sites

По поводу БЭМ и каскадности. В статьях написано примерно так: "каскадность в БЭМе допустима, но с ней нужно быть осторожнее. Если хотите 100% надежность -- лучше не использовать её вовсе".

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share


×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy