ymkins: вёрстка

Показаны сообщения с ярлыком вёрстка. Показать все сообщения

2012/03/09

CSS box-sizing

Блоки с {display: inline-block;} имеют особенность: последовательность таких блоков имеет ненулевое расстояние между отдельными блоками, если они в документе разделены пробельными символами. [CSS display: inline-Block: Why It Rocks, And Why It Sucks]

Блоки с {display: table-cell;} лишены этого недостатка. Но следует помнить, что в мозилле им нельзя поменять box-sizing, только {box-sizing: content-box}. [developer.mozilla.org/En/CSS/Box-sizing]

И вообще мозилла чудит: при {box-sizing: border-box} не работают min-height/max-height [там же]

2011/11/02

Макет с выравненными колонками

Подкинули задачу. Макет страницы в 4 блока: хедер/футер, сайд/контент. Сайд с контентом должны быть оформлены в скругленные рамки одинаковой высоты. Под современные браузеры (допустимы прямоугольные рамки в IE8).

Изюминка в колонках одинаковой высоты, не таблица:)

Дальше »

2010/03/12

IE8

Internet Explorer.
8.
Великий и Ужасный.
Настройки по-умолчанию.
Страх и Ужас.
Его надо уметь готовить.

По-умолчанию страницы с узлов интрасети отображаются в "режиме представления совместимости". Т.е. как в IE7. Не смешно, зачем тогда 8? К интрасети относится и локальный веб-сервер. Зато можно сойти с ума, сравнивая страницу с инет-сервера и локального.

Настройка:

Меню "Сервис" > "Параметры режима представления совместимости" > "Отобразить узлы интрасети в режиме представления совместимости".

IE8 (в режиме IE8:) умеет такой CSS:

#id {
  display:table-cell;
  vertical-align:middle;
}

только нужно указать подходящий тип документа, например:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru">
<head>
  <title>  </title>
  <meta http-equiv="Content-Type" content="text/xml; charset=UTF-8" />
  <meta http-equiv="Content-Language" content="Russian" />
.....