(495)
755-71-27

полный текст сообщения




zver

09:33:00 Tue 21.Jul.2009

Как в IE конфликтует position: absolute; и position:relative;

При нынешнем скоростном и дешевом интернете уже не приходится экономить на графике в дизайнах сайтов. Художнику есть раздолье приукрасить внешний вид странички всякими фенечками, "плюшками" и прочими эффектами. Зачастую в web этого не реализовать без наложения слоев, а сделать это можно используя абсолютное позиционирование (style="position: absolute;")


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

Тогда мы расставляем "отсчетные" блоки там где нам удобно, задаем им style="position: relative;" и уже внутри каждого указываем абсолютные координаты внутренних элементов. Такой подход позволяет нам показывать элементы той высоты и ширины, какой нам необходимо, не зависимо от размеров "отсчетного" блока. И большинство браузеров читают порядок "накладывания" блоков совершенно так, как хотел верстальщик. А вот IE имеет нехорошую черту (конечно не одну, просто сейчас мне хочется пожаловаться лишь на эту): если мы выстраиваем два отсчетных блока (с position: relative;) друг за другом, а внутри каждого у нас есть элементы с position: absolute; то независимо от высоты внешних блоков абсолютно спозиционированные должны бы показываться во всем размере и перекрываться только между собой (абсолют с абсолютом, если их границы накладываются друг на друга). В IE все чудесно до тех пор пока не появляется очередной "отсчетный" блок, который начинается выше, чем заканчивается внутренний "абсолютный" элемент предыдущего блока, в этом случае блок с position: relative; просто накрывает этот элемент :( (еще раз замечу, что остальные браузеры выполняют правильно задумку верстальщика, "отсчетный" блок ложиться на свое место, но оказывается ПОД всеми ранее идущими "абсолютами").

Вот тут и начинаешь извращаться и переверстывать так, чтобы и ...-ый IE либо понял что от него хотят, либо стараешься расположить блоки и элементы не "наплывающими" друг на друга, иногда приходится отказываться от некоторых "плюшек" или упрощать элементы дизайна.




kaa
12:54:55 Tue 21.Jul.2009
Re:Как в IE конфликтует position: absolute; и position:relative;

К счастью ослик медленно, но верно проигрывает в браузерной войне. Конечно, еще осталось около 50% пользователей, использующих это чудо техники, но еще пару лет назад их было 97% - тенденция налицо.



«« вернуться

аутсорсинг сайты сборка компьтеров он-лайн вещание создание сайтов сопровождение продвижение сети компьютеры данные сборка компьютеров на заказ установка ПО Гарантийное обслуживание сопровождение (техническое обслуживание компьютерной техники)