Хабр Курсы для всех
РЕКЛАМА
Практикум, Хекслет, SkyPro, авторские курсы — собрали всех и попросили скидки. Осталось выбрать!
Хабр доступен 24/7 благодаря поддержке друзей
Комментарии 81
> Странный способ с отсутствием закрывающего тега LI:
Только для тех кто не читал спецификацию HTML — для некоторых тегов закрывающий тег необязателен (к XHTML это не относится).
> Более подробно об этих способах можно прочитать в статье CSS-tricks.
habrahabr.ru/post/138501/
habrahabr.ru/post/137582/
(возможно еще что-то было)
Только для тех кто не читал спецификацию HTML — для некоторых тегов закрывающий тег необязателен (к XHTML это не относится).
> Более подробно об этих способах можно прочитать в статье CSS-tricks.
habrahabr.ru/post/138501/
habrahabr.ru/post/137582/
(возможно еще что-то было)
для некоторых тегов закрывающий тег необязателен
Этой «особенностью» я бы пользовался в самом последнем случае, ибо вот jsfiddle.net/Softlink/YYwsd/
А div к ним не относится :) (http://www.w3.org/TR/REC-html40/index/elements.html, для html5 не нашел сходу ссылку)
Да, точно.
Но все равно, как-то не по себе от незакрытых тегов :)
Но все равно, как-то не по себе от незакрытых тегов :)
Раз уж тему подняли эту. Решил побаловаться немного.
По какому алгоритму закрываются дивы?
Вот одна ситуация jsfiddle.net/Softlink/4kybd/ див сам закрылся.
Вот вторая(производная от самого первого примера) jsfiddle.net/Softlink/6jRYy/
Вложенные дивы вложились друг в друга и закрылись тоже. Получается, встретив любой элемент, он «понимает», что закрываться прямо сейчас не надо и дальше по лесенке до последнего элемента? Так?
По какому алгоритму закрываются дивы?
Вот одна ситуация jsfiddle.net/Softlink/4kybd/ див сам закрылся.
Вот вторая(производная от самого первого примера) jsfiddle.net/Softlink/6jRYy/
Вложенные дивы вложились друг в друга и закрылись тоже. Получается, встретив любой элемент, он «понимает», что закрываться прямо сейчас не надо и дальше по лесенке до последнего элемента? Так?
Посмотрел статистику. IE7 — 1.6%. Я бы тоже забил.
Флоат для сайдбара удобен тем, что если правильно все оформить, то убирая его, остальная часть контента будет автоматически на всю ширину.
Есть еще способ для списков
Так же убираются пробелы, а запрограммировать такое мне кажется проще
Есть еще способ для списков
- one
- two
- three
Так же убираются пробелы, а запрограммировать такое мне кажется проще
Для борьбы с промежутками можно использовать несколько техник.
В общем, хорошего способа нет.
Переносы, Вы хотели сказать. Это плохой способ, вредящий читаемости кода.
Во-от, а хочется хорошего способа, бескомпромиссного.
Может мой понравится :)
Не просто не понравится, а совершенно неприемлем. У меня всегда XHTML.
Года два назад и я таки был :)
С некоторых пор предпочитаю нечто вроде
В крайнем случае (при активном использовании атрибутов)
Если закрывающие теги optional, то зачем их писать? а структуру показываю отступами.
<ul><li><p>...
...
<p>...
<li><p>...
...
<p>...
<li>...
</ul>
В крайнем случае (при активном использовании атрибутов)
<ul>
<li>
<p>
...
...
<p>
...
<li>
<p>
...
...
<p>
...
<li>
...
</ul>
Если закрывающие теги optional, то зачем их писать? а структуру показываю отступами.
Эх, где ж вы были вчера…
Во множестве шаблонизаторов, по крайней мере в PHP, есть удаление пробелов. Например в twig.
Большинство постов уважаемого grokru не его — а такой себе микс переведенных статей. Несомненно, его труд заслуживает уважения, но в конечном итоге практическая ценность таких постов не слишком велика.
Я ни в коем случае не хочу обидеть автора поста, более того, я благодарен за многие интересные статьи, но, мне кажется, что стоит лучше разбираться в том, о чем рассказывается в посте. И поддерживать общение в комментариях тоже было бы неплохо.
Я ни в коем случае не хочу обидеть автора поста, более того, я благодарен за многие интересные статьи, но, мне кажется, что стоит лучше разбираться в том, о чем рассказывается в посте. И поддерживать общение в комментариях тоже было бы неплохо.
Вы правы. Обычно тема поста приходит на ум при решении какой-то практической задачи. Начинаю гуглить — нахожу интересные статьи, все они обычно расположены в англоязычных блогах. Я всегда даю ссылки на источники, а также на другие интересные сайты по теме. Многие авторы этого не делают, выдавая легкий рерайт-перевод за уникальный контент.
А в обсуждениях участвую редко из-за нежелания разводить холивары. Внимательно отношусь к критике, отзывам и замечаниям в личке, Комментарии иногда бывают конструктивны, но это скорее исключение, чем правило.
А в обсуждениях участвую редко из-за нежелания разводить холивары. Внимательно отношусь к критике, отзывам и замечаниям в личке, Комментарии иногда бывают конструктивны, но это скорее исключение, чем правило.
Пользуясь случаем, тоже хотелось бы сказать пару слов grokru. Выскажу чисто своё имхо.
grokru, я конечно понимаю, что, накатав быстрый пост на хабре, ты получишь новую карму, попиаришь свой сайт + продашь новые инвайты, как ты обычно делаешь. Но как бы ок, проблем нет, это твои дела, НО, почему бы тогда думать не только о себе, но ещё и о тех, кто будет читать твои посты?
Я просто к тому, что я не против твоего бизнеса, но, имхо, о качестве продуктов и их пользователях тоже нужно заботиться.
Почему я считаю, что тебе плевать? Всё просто. Во-первых, я читаю твои посты, в которых всегда куча неточностей: несоответствие спецификациям, важная недосказанность и т.д. Во-вторых, тебе абсолютно пофиг даже на то, что тебе пишут в комментариях. Ты никогда не исправляешь ошибки, на которые тебе указывают, показывая тем самым своё наплевательское отношение ко всем. И это касается не только твоих личных постов, но и переводов. В общем, всех твоих постов.
Я лично не вижу в твоих постах цели поделиться с народом знаниями и заинтересованности в самой теме, я вижу лишь взгрев с хабра-стада, ссори, но говорю как вижу.
За всё время ты накатал уже очеень мноога молниеносных статей, в каждой из которых было куча косяков, а теперь представь, сколько здесь сидит народа и сколько из них получили ошибочные знания, принимая их за правду. Может пора уже думать не только о себе?
grokru, я конечно понимаю, что, накатав быстрый пост на хабре, ты получишь новую карму, попиаришь свой сайт + продашь новые инвайты, как ты обычно делаешь. Но как бы ок, проблем нет, это твои дела, НО, почему бы тогда думать не только о себе, но ещё и о тех, кто будет читать твои посты?
Я просто к тому, что я не против твоего бизнеса, но, имхо, о качестве продуктов и их пользователях тоже нужно заботиться.
Почему я считаю, что тебе плевать? Всё просто. Во-первых, я читаю твои посты, в которых всегда куча неточностей: несоответствие спецификациям, важная недосказанность и т.д. Во-вторых, тебе абсолютно пофиг даже на то, что тебе пишут в комментариях. Ты никогда не исправляешь ошибки, на которые тебе указывают, показывая тем самым своё наплевательское отношение ко всем. И это касается не только твоих личных постов, но и переводов. В общем, всех твоих постов.
Я лично не вижу в твоих постах цели поделиться с народом знаниями и заинтересованности в самой теме, я вижу лишь взгрев с хабра-стада, ссори, но говорю как вижу.
За всё время ты накатал уже очеень мноога молниеносных статей, в каждой из которых было куча косяков, а теперь представь, сколько здесь сидит народа и сколько из них получили ошибочные знания, принимая их за правду. Может пора уже думать не только о себе?
> в Опере, некоторых версиях Сафари, может быть и в других браузерах поставлен пользователем.
Не знал, спасибо за информацию.
Не знал, спасибо за информацию.
ооох, примеры «Для борьбы с промежутками » частично безрадостны).
1. «Использование отрицательного значения margin:»
— только отступы между блоками зависят от размера текста, и что у вас 4px, то у другого 8px (см. системное увеличение размера шрифта, например)
2. «Странный способ с отсутствием закрывающего тега LI»
— далеко не всегда удобно и нужно держать контент в списках (в идеале, то что выглядит как список — должно быть с делано списком, табличные данные — таблицей и т.п.), и если для li закрывающий тэг не обязателен, то в случае с дивами такой способ не прокатит.
3. «Установка значения font-size на ноль:»
— если работаете с em-ами, можете забыть об этом решении
4. «Удаление пробелов в списках»
— я бы назвал самым здоровым из всехх предложенных решений, но пример, конечно, кривоват. Гораздо нагляднее в коде будет выглядеть:
Так вы хотя бы не будете ломать глаза, «кто на ком стоял» — что с чем и на каком уровне лежит.
1. «Использование отрицательного значения margin:»
— только отступы между блоками зависят от размера текста, и что у вас 4px, то у другого 8px (см. системное увеличение размера шрифта, например)
2. «Странный способ с отсутствием закрывающего тега LI»
— далеко не всегда удобно и нужно держать контент в списках (в идеале, то что выглядит как список — должно быть с делано списком, табличные данные — таблицей и т.п.), и если для li закрывающий тэг не обязателен, то в случае с дивами такой способ не прокатит.
3. «Установка значения font-size на ноль:»
— если работаете с em-ами, можете забыть об этом решении
4. «Удаление пробелов в списках»
— я бы назвал самым здоровым из всехх предложенных решений, но пример, конечно, кривоват. Гораздо нагляднее в коде будет выглядеть:
.test-div{
display: inline-block;
}
<div class="test-div">контент</div><!--
--><div class="test-div">контент</div><!--
--><div class="test-div">контент</div><!--
--><div class="test-div">контент</div>
Так вы хотя бы не будете ломать глаза, «кто на ком стоял» — что с чем и на каком уровне лежит.
> если работаете с em-ами, можете забыть об этом решении
Rem (root em) от этого спасает. Не работает только в очень старых браузерах caniuse.com/rem
Rem (root em) от этого спасает. Не работает только в очень старых браузерах caniuse.com/rem
Как раз сегодня уже давал комментарий по этому вопросу в другой теме). От этого и «px» спасает ;).
Как показывает практика, большинство наших клиентов (РФ + Европа) настаивают на поддержке того же IE, начиная с версии 8. И если с квадратными углами и отсутствием теней клиент, как правило, готов мириться, то с простыней одним кегелем — уже никак.
Поверьте, я только за использование rem, и жду не дождусь, пока пожилые версии IE канут в лету, но суровые реалии таковы, что пока для этого немного рановато.
Да и вцелом, об этом способе борьбы с отступами: использование общего правила для решения частной ситуации — плохая практика, действие по принципу «сначала создаем проблему, а потом ее решаем».
Как показывает практика, большинство наших клиентов (РФ + Европа) настаивают на поддержке того же IE, начиная с версии 8. И если с квадратными углами и отсутствием теней клиент, как правило, готов мириться, то с простыней одним кегелем — уже никак.
Поверьте, я только за использование rem, и жду не дождусь, пока пожилые версии IE канут в лету, но суровые реалии таковы, что пока для этого немного рановато.
Да и вцелом, об этом способе борьбы с отступами: использование общего правила для решения частной ситуации — плохая практика, действие по принципу «сначала создаем проблему, а потом ее решаем».
Inline-block по умолчанию выравнивается по базовой линии, а float — по верхнему краю.
По какому-такому верхнему краю? Далеко не факт.
Удивительный float
Всегда есть нюансы.
Всегда есть нюансы.
Это не важно, мы живем в эру постоянно мигрирующих стандартов, поэтому нужно помнить, что знания, которые были получены в прошлом, не факт что будут работать в будущем. Кстати, помнится был драфт мультиколочного текста, при котором флоат мог принимать значение fr и располагаться между колонок. А еще нужно держать в голове, что для монгольского языка лево и право может быть далеко не слева и справа.
из профиля
>> хабраюзерам-новичкам дам совет по подготовке и оформлению топика.
are you serious? судя по качеству публикуемых вами материалов… я бы посоветовал новичкам обойтись без вашего совета.
статус вконтактика
>> хабраюзер #1
а вот тут все встает на свои места — как я предположил ранее, в посте который вы поспешно убрали в черновики (волнение за карму?), вы набиваете счетчик. Что же… меня это не очень удивляет. Меня поражает то, что пипл хавает. Неужели в сфере веб-разработки все так плохо? Хотя… с другой стороны, чем больше неучей — тем я ценнее как специалист, так что дерзайте )
>> хабраюзерам-новичкам дам совет по подготовке и оформлению топика.
are you serious? судя по качеству публикуемых вами материалов… я бы посоветовал новичкам обойтись без вашего совета.
статус вконтактика
>> хабраюзер #1
а вот тут все встает на свои места — как я предположил ранее, в посте который вы поспешно убрали в черновики (волнение за карму?), вы набиваете счетчик. Что же… меня это не очень удивляет. Меня поражает то, что пипл хавает. Неужели в сфере веб-разработки все так плохо? Хотя… с другой стороны, чем больше неучей — тем я ценнее как специалист, так что дерзайте )
Также для борьбы с промежутками можно использовать letter-spacing: -4px; но не работает в Safari.
Очен правельно отметил Matrosked, что 4 пикселя у большенства и зависит от размера шрифта. Вообще не стоит разчитывать на них!
Самый лучший способ — создовать HTML в котором отсутсвуeет whitespace между тагами.
Очен правельно отметил Matrosked, что 4 пикселя у большенства и зависит от размера шрифта. Вообще не стоит разчитывать на них!
Самый лучший способ — создовать HTML в котором отсутсвуeет whitespace между тагами.
Пока есть IE7, лучше пользоваться float. Но иногда другого выхода просто нет.
Зарегистрируйтесь на Хабре, чтобы оставить комментарий
Inline-block как замена float