Проблема с отображением background'а при масштабировании

[Tok13]

Здравствуйте! Проблема такая. Делаю background в блоках DIV, в бекграунде сразу три изображения по спецификации css3, всё нормально отображается и работает, но только тогда, когда масштаб стандартный, т.е. 100%. Когда в браузере уменьшаю масштаб, то тех бекграундовых изображений, у которых ширина 1px становится не видно. Так и должно быть или от этого как-то можно избавиться, чтобы всё отображалось даже при уменьшении масштаба?

Не знаю, что сюда привести... ну, вот css код того блока, в котором исчезает:

.cont_verh_svitok_part2_center_fon {
display:inline-block;
padding:0;
margin:0;
border:0;
outline:none;
overflow:hidden;
width:189px;
font:12pt Palatino Linotype,verdana,arial,helvetica;
vertical-align:top;
text-align:center;
background:url(images/formochki_table/main_left_stolb/verh_svitok_part2_center.gif) no-repeat center top,
			 url(images/formochki_table/main_left_stolb/palka_horizontal_niz.gif) no-repeat bottom,
		 url(images/formochki_table/main_left_stolb/palka_vertical.gif) repeat-y left top,
			 url(images/formochki_table/main_left_stolb/palka_vertical.gif) repeat-y right top,
			 url(images/fons/fons_left_stolb/fon_left_stolb_1.jpg) repeat;
background-origin: content-box;
background-clip: content-box;
background-size: auto;
}

[a1rborn]

задать размеры img в процентах?

[Tok13]

Каких img?? Для бекраунда же указания top bottom left и т.д. и означают процентное заполнение относительно каких-то сторон. Т.е. растягивается-то всё растягивается и даже повторяется, но те элементы, которые имеют сами по себе маленькую длину или ширину исчезают при уменьшении масштаба)

[caprella]

Если можно, выложите код с полными путями к картинкам, чтобы хоть было, с чем "играться"

[Tok13]

Тут не нашёл, как файл прикрепить. Загрузил через ifolder. Там папка со всем необходимым по этой проблеме. CSS файл, необходимые изображения и html файл. Вот ссылка на скачивание: http://rusfolder.com/34701390

В разных браузерах при уменьшении масштаба по-разному. Где одна вертикальная полоска исчезнет, где другая, где обе. Если это невозможно исправить, то уж смирюсь, но если как-то можно, подскажите, пожалуйста)) Когда верстал это всё таблицей, вроде таких проблем с исчезновениями не было, а как начал блоками - начались.

Исчезает в firefox и в ie в основном. В chrome крайние вертикальные полосы остаются, но исчезают вертикальные полоски, разделяющие текст)

Нормальный масштаб:

Уменьшенный масштаб:

[Kray Storm]

Судя по описанию, похоже на проблемы округления размеров в px при масштабировании. Суть в том, что при масштабе 0,75 или 0,5 браузер и монитор физически не могут отобразить 0,75 или 0,5 пиксела. Поэтому браузеры выкручиваются прибавлением/отниманием 1px от общей величины элемента. Теоретически можно исправить ситуацию, если сделать разделительные линии в 2px. Тогда 1 пиксел будет "в запасе" при масштабировании. Но, конечно, линии будут толще. Ну или попробовать самому блоку с горизонтальной чертой задать height:3px, а внутри уже выровнять изображение по центру.

Кстати, только что сам столкнулся с подобным в Firefox: есть <span>, за ним сразу <div> в нормальном потоке. Никаких отступов нет. Так вот, при масштабировании, между ними как раз то возникает, то пропадает 1-пиксельный горизонтальный зазор.

Edited January 27, 2013 by Kray Storm