troll

Chrome 18.0.1025.151 m / Win7 x64

По-моему, растягивается слишком уж гибко. Хотя всего не предусмотришь, конечно.

Тогда пара вопросов от новичка: По каким причинам фон шапки сделан через img, а не background? Для чего в подвале используется таблица?

Помогите, пожалуйста, понять, как решаются проблемы, связанные с каскадом. Например, в Матрешке в реализации блока .b-article есть такое правило: .b-article a:visited {color: #974dac;} Допустим, мне нужно внутрь .b-article вложить кнопку .b-pin с текстом определенного цвета. Я пишу следующий код: <style> .b-pin {color: green;} </style> <div class="b-article"> <p>Lorem ipsum</p> <a href="/foo" class="b-pin">More</a> </div> Но после перехода по ссылке ее цвет изменится. Как этого избежать? Я вижу следующие способы: Делать как Яндекс в библиотеке bem-bl, т.е. не использовать каскад почти никогда, а на каждый элемент навешивать класс. Меня как верстальщика такой подход устраивает, но, боюсь, его не оценят те, кто будет заниматься поддержкой и наполнением сайта. Использовать !important для повышения приоритета отдельных объявлений. По-моему, плохой способ, способный серьезно запутать код. Задавать стили, которые с большой вероятностью придется переопределить, с помощью простых селекторов (вместо .b-article a:visited писать a:visited). Тоже мало хорошего: как минимум, придется писать дополнительный код, т.е. к .b-pin дописывать .b-pin:visited. Существует ли какой-нибудь более разумный и удобный вариант?

Если нужны прототипы, можно скрестить первый вариант со вторым: var pics = []; function Picture(settings){ this.name = settings.name; this.x = settings.x; this.y = settings.y; this.image = settings.image; } Picture.prototype.draw = function(ctx) { if (this.image) { ctx.drawImage(this.image, this.x, this.y); } return; } for (var i = 0; i < JSON.Objects.length; i++) { pics.push(new Picture(JSON.Objects[i])); } Или вот так сделать, но работать будет только в Firefox и вебкитных: function Picture(){} Picture.prototype.draw = function(ctx) { if (this.image) { ctx.drawImage(this.image, this.x, this.y); } return; } for (var i = 0; i < JSON.Objects.length; i++) { JSON.Objects[i].__proto__ = Picture.prototype; }

Блочная верстка. Выравниваем список по ширине.

Почему?

Неправда, ни одним из вышеуказанных способов нельзя задавать font-weight. Возможные значения этого свойства перечислены в спецификациях CSS 2.1 и CSS 3.

"Ошибка значения font", похоже, означает баг в валидаторе: он не понимает числовые значения свойства font-weight.

По-моему, там отошли от понятий "блочный" и "строчный". Элементы теперь относят к определенным категориям, и у каждого элемента есть content model, определяющая, что может быть у него внутри.

Нет, на такую подлость способен только previousSibling, а previousElementSibling даст либо предыдущий элемент, либо null.

filter - это регулярное выражение test

W3C "не рекомендует" (т.е. в некоторых обстоятельствах все же допускает) использование таблиц в презентационных целях, а WHATWG это прямо и безусловно запрещает.

Прошу простить, я неточно выразился. Имелись в виду не XHTML и HTML(5), а это и это.

Интересно получается, W3C'шная и WHATWG'шная спеки друг другу противоречат...

Google JS Style Guide с ними солидарен:

Так ничего не выведет, может только ошибку в консоль)

Отсюда: }(n); //Создаем функцию, сразу же её вызываем она возвращает нам порядковый номер элемента в alert при событии click на элементе. В функцию передается не x, а n. Посмотрите, например, на такой код (надеюсь, будет понятно, что он делает, если нет - почитайте здесь): var n = 1, f = function(x) { return x; }; var m = f(n); Можно его чуть-чуть модифицировать, вызвав функцию сразу же после объявления: var n = 1, m = function(x) { return x; }(n); В обоих случаях в переменной m окажется одно и то же значение - результат выполнения функции.

table-layout: fixed должен помочь: http://jsfiddle.net/LFUcJ/

SelenIT, здорово! А можно как-нибудь зафиксировать размер ячеек, чтобы они не прыгали при наведении? Тьфу, извиняюсь, затупил...

Фокус не мой, о нем еще 2 года назад здесь же писал Great Rash.

Это копипаст из темы про БЭМ, должно убирать пробелы между инлайн-блоками.

Вроде бы получилось на 1 обертку меньше, если только я не упустил каких-либо деталей: http://jsfiddle.net/ys9hd/.

Я бы сказал, что это баг Webkit, а остальные делают все правильно. При list-style-position: inside блок маркера должен быть первым inline box'ом внутри li, но, так как рядом с ним (блоком маркера) есть div c display: block, он (блок маркера) будет обернут в anonymous block box. Таким образом, div расположится на следующей за маркером строке. Во всяком случае, мне так кажется.

Где-то читал, что при назначении обработчика в HTML-разметке браузер создает из значения атрибута тело анонимной функции, которая затем вешается на нужное событие. Т.е. <body onload="confirmAllLinks();"> в каком-то смысле равнозначно <script> document.body.onload = function() { confirmAllLinks(); }; </script> Очевидно, без скобок смысл будет совсем другой. PS: не ручаюсь за достоверность данной модели, так что если ввел в заблуждение - извините.