SelenIT

Там был PHP-инклюд другого файла скорее всего.

Никакую версию какой бы то ни было спецификации старше 4-6 месяцев читать нельзя никогда*. Если последняя опубликованная версия старше — читайте редакторский черновик. Он, как и живой стандарт, всегда свежий. *если вы не юрист-патентовед, разбирающий жалобу о нарушении какого-то патента в одной старой реализации, если вы не пишете статью/диплом по истории этой технологии, или если вам ещё для чего-то не нужна именно та архивная версия.

Может быть, BOM-метка?

Через пару месяцев 2018-й год, ребята. Эра флексбоксов давно уж на дворе. Контейнеру display:flex да align-items:center — и вся недолга, сколько бы строк ни было...

Понятие «блочные элементы» отмерло вместе с HTML4. На Webref (и во многих др. местах) оно осталось чисто в силу традиции, но смысла в нем сегодня очень мало. Вас не должно волновать, «блочный», «строчный» или «худосочный» сам элемент, вас должно волновать, что в него можно класть — т.е. какая у него модель содержимого (Content model). Для каждого элемента она указана в спецификации. Content model у TD разрешает класть в него практически всё — хоть дивы, хоть абзацы, хоть заголовки. Мучиться со спанами и «бряками» нет никаких причин. Так что читайте спецификации и не усложняйте себе жизнь ради давно неактуальных мифов!

Я бы нарисовал в SVG и наложил как border-image.

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

Border-image по умолчанию заполняет толщину обычного border-а, а она по умолчанию нулевая. Плюс Хром и ему подобные требуют, чтобы border-style тоже был не none. Подробнее здесь: http://css-live.ru/articles-css/understanding-border-image.html. Но на мой взгляд, border-image для этой задачи — из пушки по воробьям. А проще всего сделать эту палочку неповторяющимся одноцветным градиентом, ограничив ему background-size, типа такого: background: #4ccfc1 linear-gradient(#fff,#fff) left center no-repeat; background-size: 1px 0.8em; А по :hover менять только background-color.

(с) — не пруф. Есть скрин реальной статистики сайта с >2% ископаемых IE?

Нет больше таких браузеров, не выдумывайте Хотя иногда и в сторону таблиц (CSSных, разумеется) посмотреть имеет смысл. В общем, действуйте гибко, без предрассудков!

Вот по этому и не прячется. relative + z-index = новый контекст наложения. У фона и бордеров элемента, создающего контекст наложения, z-index по факту минус бесконечность. А z-index самого контекста влияет только на перекрытие его другими контекстами (не из числа его потомков), внутри контекста оно никакой роли не играет.

Уточните, про какие именно правила речь. CSS-свойства бывают наследуемые и ненаследуемые, первые (font-size, color и т.п.) распространяются на потомков по умолчанию, вторые (display, padding и т.п.) — нет, их надо указывать явно. Подозреваю, что дело в этом. В примере на jsfiddle я стилей для .menu почему-то не наблюдаю. Возможно, они в файле style.css (который не загружается, т.к. указан относительный путь, а на сервере jsfiddle.com такого файла нет)? Лучше скопировать содержимое этого файла (как минимум, то, что относится к .menu) прямо в панель CSS в самом примере.

Во-первых, НЕ ПАНИКОВАТЬ! Это не заказчик ругается, не босс отчитывает, не жена скандалит, не «братва наехала», и т.п.. Это просто глупая программа, которая к тому же изо всех программных сил хочет помочь (но тут вышло у нее очень неуклюже). Есть хорошее интервью с разработчиком этой программы, где он доступно поясняет, в чем ее смысл. Во вторых, это не ошибка (Error), а всего лишь предупреждение (Warning). Т.е. формальные правила HTML не нарушены, фактически документ валиден. Но глупой программе показалось, что что-то в документе нелогично. Возможно, совершенно напрасно. В конце концов, кто может знать логику документа лучше, чем его автор? Так что не надо кидаться сходу что-то исправлять только из-за того, что программе что-то показалось — в конце концов, у всех программ бывают просто глюки. Но лучше всё-таки перестраховаться и перепроверить, что там ему померещилось и почему. Мало ли. Вдруг действительно что-то можно улучшить:). В третьих, это не экзамен, где отвечают только «верно/неверно» и при ошибке заставляют перепроходить тест заново. Программа сама, английским по белому, объясняет, что ей тут... даже не то чтобы не понравилось, а показалось подозрительным — достаточно спокойно прочитать, что она вам пишет (можно через гугл-переводчика, если с английским проблемы). А пишет она вам буквально следующее: В общем, текст у вас помечен как английский, но на английский не похож. Да и вообще на осмысленный (но, повторюсь: это лишь частное мнение глупой программы!). Вообще-то это может быть проблемой: лучше всегда тестировать верстку на текстах, «максимально приближенных к боевым» — разной длины, с очень короткими и очень длинными словами (желательно из предметной области сайта). Заодно так ловятся проблемы верстки, если какое-нибудь длинное слово что-нибудь разопрет, сломает красивое обтекание, не впишется в рамку и наедет на соседа и т.п. Так что если вы проверяете голый каркас верстки, без наполнения — лучше потратьте пару минут и проверьте с наполнением тоже. Скопируйте пару текстов с другого сайта похожей тематики, например. А если проверяете с текстом — проверьте этот текст на орфографические ошибки, может быть, их там так много, что язык исказился буквально до неузнаваемости. Если же текста на странице вообще не должно быть или он и не должен быть осмысленным (мало ли!) — попробуйте действительно сделать то, что предлагает программа и справка по ее ссылке : поставьте lang="zxx". Заодно всякие читалки для слепых не будут ломать свои синтезаторы, пытаясь озвучить это как осмысленные слова — всем пользователям будет легче разобраться. Или, если пока неизвестно, на каком языке будет страница, оставьте атрибут пустым (lang=""). Но вполне может быть, что это действительно просто глюк. Тогда... тем более см. п. 1

Три года как пофиксили тот фоксовый баг. Да и второй с ним за компашку. Три года, Карл! Сколько можно жить прошлым и возводить напраслину на мой любимый браузер? Проверить же можно за полминуты...

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

Из метрик шрифта.

Придумался только вариант с фоновой картинкой. И то только для новых браузеров.

Зачем??? В преддверии 2017-го года-то?.. И вопрос вроде был про радиальный градиент, а не про линейный.

Вот такие музейные экспонаты любят заводиться только в IE, причем только в режиме обратной совместимости.

Припоминаю, был у вымерших IE такой баг, что :active фактически работал как :focus (a :focus, ЕМНИП, вообще толком не работал). Как быстрый костыль, могу предложить любое-ненужное-свойство: expression(this.onFocus=this.blur()); (источник). Нормальные браузеры проигнорят, а этот zombie сможет наконец у(с)покоиться...

Возможно, у вас не «фон не срабатывает», а сама высота не учитывает содержимое элемента. Так бывает, например, если это содержимое — float-ы, а блоку не задан ни .clearfix, ни какое-либо из свойств, создающих отдельный блочный контекст форматирования (display: inline-block/table/table-cell, overflow:hidden/auto, само float).

<div class="left"> <p style="padding-bottom:110px;">Телефон:</p> <p>E-mail:</p> </div> <div class="right"> <p>095 432 02 95</p> <p>063 296 89 61</p> <p>067 910 58 62</p> <p class="mail"><a href="viber://chats">viber://tel: +380632968961</a></p> <p class="mail"><a href="mailto:mebel-studio@kh.ua">mebel-studio@kh.ua</a></p> </div> Не надо так. Как бедный поисковик или читалка с экрана голосом поймет, что первые четыре абзаца справа — телефоны? Подписи и то, что они обозначают, должны быть сгруппированы вместе и идти последовательно.

Для электрика в селе вставить одну обычную button в отдельную последнюю ячейку tr-ки, как деды еще делали. А для столичных хипстеров кнопку спрятать и навесить на всю tr обработчик клика с тем же действием, и все будут довольны. Прогрессивное улучшение называется! А «в лоб» задать кнопке табличное или еще какое-то хитрое отображение, увы, вряд ли выйдет, тем более кроссбраузерно. По-моему, без скрипта тут никак особо не выкрутиться.

Может, если важно именно построчное совпадение, есть смысл делать банально таблицей — строчка оригинала, строчка перевода?

На самом деле зависит от свойства. Бывают наследуемые свойства и ненаследуемые. Display — ненаследуемое. При display:flex и будущем (как минимум в Firefox 52+ и Chrome 57+) display:grid к непосредственным потомкам такого контейнера применяются особые правила, это да. Но само свойство не наследуется, так что если надо разместить флекс-контейнер во флекс-контейнере, внутреннему блоку всё равно тоже надо будет явно указать display:flex.