Serlutin

А ctrl+u нажать не судьба? UPD: Какой смысл в xHTML синтаксисе, если нет тегов HTML и BODY?

Ну тогда да, обосновано. Хотя опять же если подумать, то в любом случае там будет либо текст, либо реклама, либо картинки с таблицей. То есть в любом случае это можно будет назвать статьёй или заметкой. К тому же, если я не ошибаюсь, то article позволяет большую свободу. Там может содержаться всё что угодно. Я как-то раздумывая где надо использовать section, а где нет, пришёл к такому выводу. section является самой младшей структурной единицей. То есть, например, в footer может находится несколько разделов (section), а в section футер находиться не может. Хотя возможно и исключения. ИМХО.

<section class="content"> Фууууууууууууууууу <article class="content"> Есть малообоснованное подозрение, что Google к article относится лучше. К тому же по семантике более правильно.

С одной стороны правда. Иногда лучше пусть работает везде одинаково, а в коде будет чёрте что. Ведь конечному пользователю всё-равно пофиг. Однако, ведь приятно, когда у тебя чистый и красивый код. Ещё если вдруг на сайт зайдет верстальщик, заглянет в код и увидит там красоту, то уважение к сайту его повысится. Теперь по коду. В CSS у вас постоянно повторяется font-size: 15px. Задаёте вы его один раз .menu и всё. Дальше по HTML. Не гласным стандартном считается делать навигацию с помощью немаркированных списков (UL и LI) <ul class="menu"> <li class="about"> <li class="galery"> <li class="production"> <li class="answer"> <li class="contacts"> <li class="cert"> </ul> Картинку под меню лучше делать с помощью bacground-image. Чтобы список был не вертикальным, а горизонтальным можно использовать float: left или display: inline-block; Картинку лучше разрезать. Если чуть-чуть подзаморочиться, то нужно всего 2 изображения, которые будет использоваться везде, вне зависимости от количество пунктов в меню и размера текста в них. Итого мы получаем, что-то такое menu { list-style: none; margin: 0; padding: 0; font-size: 15px; /* лучеш задавть в em, относительно размера в body*/} menu li { display: inline-block; /* для поддержки IE, через хаки нужно добавить display: inline; zoom: 1; */ height: 25px; /* соль и специи по вкусу*/ background: url (image1.gif) no-repeat; } menu li a { background: url (image2.gif) no-repeat; line-height: 25px; /*вроде как выровнить должно по центру*/ }

Есть подозрение, что подключаемый шрифт нужно заключать в кавычки, (Times New Roman желательно тоже). Если не поможет, то как вариант резервные шрифты подключать с помощью другого обращение. Например, красивый шрифт подключаем к .font, а все остальные через div.font - может быть поможет.

Боюсь, что их решить будет невозможно. Дело в том, что position: absolute выбивает блоки из потока. То есть для этих блоков как бы не существует соседей, поэтому они ведут себя как хотят. Блоки прилипают к краям браузера, и оттуда их никак не отлепить. Поэтому при сжимании происходят странные вещи. Тут даже min-width не поможет. Точно такая же проблема и с футером. С его точки зрения этих двух сайдбаров тоже не существует, а есть только главная колонка. Как вариант, следить, чтобы середина была всегда больше сайдбаров, но, мне кажется, что это очень не удобный способ. На вашем месте я бы взял один из шаблон, который уже проверен временем. Что-нибудь из этого (LayoutGala)

Да, а что там рассказывать. Делаем картинку шириной в 2px и высотой, которой вам нужно. Дальше блоку прописываем такие свойства: background: #0F57A3; url(картинка.gif) top left repeat-x; Что всё это значит читаем здесь: background

Пустой элемент проходит валидацию.

Не пробуйте. Всё равно не получится.

Что вас смущает больше всего? Я бы градиент сделал картинкой и прижал бы его к верху. Снизу бы задал просто синий цвет. А кто-нибудь сделал бы вот так: background: #0F57A3; /* old browsers */ background: -moz-linear-gradient(top, #0F57A3 46%, #0372E8 100%); background: linear-gradient(top, #0F57A3 46%, #0372E8 100%); background: o-linear-gradient(top, #0F57A3 46%, #0372E8 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(46%,#0F57A3), color-stop(100%,#0372E8)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0F57A3', endColorstr='#0372E8',GradientType=0 );

Вот, что Гугл думает по этому поводу: https://www.google.com/support/webmasters/bin/answer.py?hl=ru&answer=47334

Вот никогда нельзя делать: <a href="#"><li> ... </li></a> Нужно так: <li><a href="#"> ... </a></li> background: url('images/top-navigation.png')no-repeat; Возможно не хватает пробела перед словом no-repeat

Ну тогда делайте их не вложенными div+(div>div>div>div)+div

Ну и что вам мешается сделать 3, 4 или 5 (или 10 сколько понадобиться) вложенных дивов с фоном. Нужно блоки для верхней, нижней, 2 боковых и фона папки. И ещё один добавляем для контента. Итого 6 блоков вложенных друг в друга. Не так страшно, как кажется. P.S. Возможно скоро прийдёт Светлана и скажет, что куча дивов прошлый век и нужно использовать Multiple backgrounds, а в ie делать через экспрешны. Типа вот так: /* для IE */ .backG { background: url(img/bg-1.gif) bottom left no-repeat; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader (src='img/bg-2.gif', sizingMethod='crop'); } /*Обращение к тому же блоку только более точно. IE будет игнорировать неизвестные ему свойства во втором обращение и использовать первое.*/ div.backG { background: url(img/bg-1.gif) bottom left no-repeat, url(img/bg-2.gif) top left no-repeat; } Вот примерчик накидал: http://serlutin.nxt.ru/example/multiplebg.html

Блоку #fifty задайте width: 100% Только не спрашивайте почему.

Забейте вы на него. Этим браузером сейчас только мазохисты пользуются

margin: 0 auto; - выравнивает по центру. В вашем случае эта та же самая запись, только не сокращённая.

<ul class="menu_body"> <div class="settingsChange">You can change your:</div> В теге UL не должны быть только теги LI (а вот в них уже практически всё что угодно) Если не поможет, то дайте ссылку на страницу.

Кстати, а вы случайно код не с помощью FireBug смотрели? Потому что он автоматически дописывает непрописанные свойства. Поэтому в коде может быть написано background: #FFFFFF, а в жуке background: none repeat scroll 0 0 #FFFFFF

Помню, читал я когда-то про то, что в каком-то допотопном браузере возникают проблемы с отображением background-color, при каких-то условиях. Однако это глюк уже возможно вряд ли где можно повторить, поэтому причина в другом. Причина один: запись background: red выглядит короче, чем background-color: red Причина два: очень часть помимо фонового цвета добавляется фоновый рисунок. Горздо удобнее прописать всё в одном параметре, чем в 6 или даже 7. UPD: опоздал :-)

Эту проблему пытаются уже решить. Например CSS Regions (PDF) от Adobe. Выглядит круто, но синтаксис, как всегда опять какой-то замудрённый и не понятно, когда ещё это начнёт поддерживаться. Как минимум лет 5 ждать.

Да, пусть все браузеры квадраты начнут нормально обрабатывать. Дело ведь в том, что просчитывать поведение нестандартных блоков очень сложно. Если два квадратных блока будут состыковаться без зазоров, то вот уже триугольник и круг состыковать не получится. Если уж так нужны круги и всяких там угольники есть SVG и canvas. В дизайне же можно и картинкой обойтись.

Вы когда-нибудь видели круглые кирпичи? Да бывают кирпичики с круглёнными уголками, но прям настоящие круглые кирпичи. Возможно видели. А дом, построенный из круглых кирпичей? Всего одним свойством, вы разрушаете блочную структуру. Как прикажете, обтекать круглый треугольные блок? Ведь ширина сверху и снизу разная. DIV{ size: 0 40px 80px 40px; } Вот такой записью вы нарушаете блочную логику. CSS имеет дело только с квадратами и прямоугольниками, у которых противоположные стороны равны и параллельны.

Оно?

Уже много раз говорилось, почему производители браузеров стали так рьяно вводить закруглённые уголки и тени, вместо внедрение Flexbox и Template. Дело в том, что жить без круглых уголков можно, а вот каждый раз смотреть, в каком браузере не работает ширина - муторно. Вы не поверите, даже если бы сейчас все браузеры овладели этой функцией, то я вряд ли стал её пользоваться. Я вообще привык группировать width, min-width и max-width рядом, хоть где-то это считается и неправильным. CSS уже года 3, как отказался от версионности. Вот эту запись, я совершенно не понял: DIV{ size: 0 40px 80px; } На счёт бордеров, мне более-менее понятно. Там всё сделано за счёт взаимодействие разных границ. Они соединяются между собой под уголом. Именно поэтому и получается треугольник (только надо ещё ширину и высоту = 0 поставить, иначе ужасы из школьной геометрии вновь вернутся) Теперь смотрим на вашу запись. Первое значение: ширина = 0 Второе значение: высота = 40px Только вот без ширины, блока нет. Хоть ему бесконечную высоту нарисовать. Третье значение: длина? диагональ? = 80px. Явно треугольник не получается. И ещё. Синтаксис CSS подразумевает, что каждое значение имеет своё название. То есть border-bottom:80px solid #FFFFFF; Это border-bottom-width, border-bottom-style, border-bottom-color. В случае с size придётся при необходимости придётся расписывать так? size-width и size-height? Практичности от такого нововведения будет 0