Блог Дмитрия Волотко Подпишись на обновления!

Трёхпиксельный контейнер – nbsp против HTML-комментария

Часто встречается необходимость использовать контейнеры с малой высотой или шириной. К примеру для рамки сайта, толщиной 3х3. Логичным будет положить картинку фоном и установить повторение по нужной оси. Но ячейку нужно чем – то заполнить. Часто встречаю, что туда кладут nbsp, но тут есть большой минус – nbsp имеет физические размеры, сопоставимые с размерами шрифта, и порою они не влазиют в те рамки, которые установлены контейнеру. Есть выход – указать font-size:1 тому контейнеру, в котором планируется разместить nbsp.

Но зачем? Намного проще использовать HTML-комментарий.

<!–– ––>

Физических размеров не имеет, и контейнер будет ровно тех размеров, которые нужны вам. Просто и без изврата.

Так же можно почитать:



# 17 April 2008 в 12:23

aedus

в 6 эксплорере не всегда пройдет такое. Самый лучший вариант – где
.spacer {
width: 1px;
height: 1px;
}

# 17 April 2008 в 12:24

aedus

усп, тег потерялся: img src=”..space.gif” class=”spacer”

# 17 April 2008 в 19:24

Волотко Дмитрий

2_aedus, спасибо, ты прав.

# 18 April 2008 в 16:19

Inok

Все было замечательно до тех пор, пока не просмотрел в EI

# 18 April 2008 в 19:01

Волотко Дмитрий

2_Inok, да, в ИЕ не всегда срабатывает.

# 21 April 2008 в 17:15

Inok

Есть множество решений этой проблемы, но все сводится к задротству. Например можно растягивать однопиксельный гиф спейсер в 48 байт, но это лишний код, да и когда выделяешь все, то этот спейсер виден активным (помечен браузером как картинко). Вот извращаться паддингами и маргинами не пробовал, не знаю, будет ли схлопываться ячейка.

Вобщем, намного проще оставить пробел )) Но “трушные” верстальщики считают это недостойным выходом =)

Блин, только что прочитал выше коммент про спейсер, сорь за повтор xD

# 21 April 2008 в 19:23

Волотко Дмитрий

Inok, вы правы – извращаться можно как угодно )



* Должны быть заполнены.
Из-за дикого спама, и нежелания ставить капчу оставлять ссылку у комментария вообще нельзя. Точно так же нельзя оставлять ссылки в теле комментария.