RoleXXX

Проблема решена. Глюк возникает тогда, когда контрол обернут в блок с дефолтными свойствами, то есть с position:static. Если изменить позиционирование на relative или float, то глюк исчезает. Такой же глюк может возникнуть когда родителю одновременно прописано position:relative и float. Нужно оставить что-то одно.

Метод давно и всем знакомый, поэтому я не стал расписывать подробно. Нужно?

Есть кнопка, сделанная по методу раздвижный дверей: <div class="my_button"> <div class="left_side"></div> <div class="right_side"></div> <button></button> </div> .my_button{position:relative; height:200px;} .left_side{position:absolute; height:200px; left:0; right:10px; background:url;} .right_side{position:absolute; height:200px; right:0; width:10px; background:url;} В общих чертах так. Получается замечательная кнопочка с любыми эффектами, которая сама тянется (в разумных пределах) в зависимости от текста в button. И это замечательно работает во всех браузерах, кроме ИЕ7 и 8(режим совместимости). В них через раз происходит следующее. Бокс left_side перестает считать my_button своим родителем и растягивает правый край не до правого края родителя минус 10рх, а до края окна броузера. Кто-нибудь сталкивался??

Нашел решение. Если вместо background:transparent прописать background:url(прозрачный.png) дырка исчезает.

Не нада ёрничать. ИЕ7 хоть и устарел морально, но игнорировать его пока ещё нельзя. Да, я не знаю, вернее не знал, ссылку на валидатор. Потому что обычно мне хватало валидации в Дримвивере и идентичного отображения страниц в актуальных версиях Опера, Сафари, Фаирфокс, Гугл хром, а так же ИЕ7 и 8. Что в этом криминального?

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

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

Делаю лайтбокс с затемнением страницы. Кладу на него кастомный инпут. Кастомный = с закругленными краями, с тенями: <div class="myinput"> <div class="left_side"></div> <div class="right_side"></div> <input /> </div> и всё тип-топ везде, кроме лайтбокса в ИЕ8. В нём, из-за того что для инпута прописано background:transparent; (а иначе инпут белым прямоугольником будет перекрывать все закругления и тени) этот самый инпут становится не просто прозрачным, но образует дырку в лайтбоксе. То есть в области инпута становятся доступными элементы (ссылки например), которые лежат ПОД лайтбоксом на недоступной странице . Вот такая есть проблема.

Дайте ссылку плиз.

Поддерживаю тех, кто положил на ИЕ6. Так и нада! Микрософт не поддерживает. Ютьюб официально заявил что в следующей версии сайта, которую они сейчас готовят не будет поддержки ИЕ6. И т.д. и т.п. А для тех дремучих, кому иконка ИЕ=Интернет вежливо пишем на сайте "Извините, ваша версия броузера сильно устарела. Пожалуйста установите новую версию или альтернативный браузер." И ниже кучка ссылок на ИЕ, О, ФФ, ГХ, С. Вопрос к тем, кто занимается поддержкой ИЕ6. Если к вам придет клиент и скажет "У меня 486-й комп, виндоус 3.1 и нетскейп навигатор 1.0. Сделайте мне сайт, чтобы он у меня тоже отображался так, как у моих современных друзей" вы прогнетесь и будете верстать под него??? Невозможно до бесконечно поддерживать устаревшие решения. Это всё равно что делать поезд у которого будет поддержка и нормальной и узкой колеии одновременно только потому, что где-то в глубинке сохранился ржавый кусочек узкоколейки! ЗЫ. Ёжики плакали, плевались кровью, но продолжали жевать кактус. Извините, но по-моему очень похоже на тех, кто пытается до сих пор поддерживать ИЕ6.

Дело в том, что сайт строиться динамически на основе html-шаблонов Валидатор, встроенный в Дримвивер ЦС4 говорит, что с шаблонами всё в порядке. А как провести валидацию динамической страницы сайта?

А прописать .title span{color; font-size;} нельзя? Для варианта <h1 class="title><span>12.03.12.</span>Название новости</h1>

При загрузки страницы с сервера блоки на странице отображаются то правильно, то неправильно. При чём неправильность может быть разная. Если подряд понажимать F5, то результаты могут быть разными. Хорошо видно, что при этом все прописанные в коде блоки присутствуют на странице. Но их оформление и расположение (то есть то, что описывается в стилях) рандомно глючит. То есть очевидно, что не полностью загружаются стили. Проявляется это только в ИЕ7. Может кто-то сталкивался с такой проблемой и есть варианты решения?

Та реализация немного излишне сложновата. И не будет работать в опере. Потому что опере нужно height:auto!important. Вроде бы так. body говорите? а вы пробовали? В обоих описанных вами случаях градиент отбражается внизу окна, а не внизу страницы. И если контента много, то градиент скроллится вверх вместе с контентом. Его можно положить только в блок у которого height:auto!important; min-height:100%, то есть высота на 100%. Или в блок, следующий за ним (футер) и поднять отрицательным margin-top. Ну или в блок, следующий за футером :-) как сделал я, потому что у меня градиент на всю ширину, а футер узкий центрированный.

Ситуация с футером, который должен быть всегда внизу страницы. Плюс внизу же должен быть градиент... Впрочем ситуацию удалось разрешить. Просто добавил после футера еще один блок с отрицательным z-index, вставил в него градиент с отрицательным top (иначе опера оставляла внизу страницы место под него) и поднял этот блок под футер (и под всё остальное) отрицательным margin-top. ЗЫ. отрицательные маргины рулят! :-) ЗЫЫ. Дык получается что прав ИЕ, а все остальные броузеры косячат с z-index?

Спасибо. Но меня интересует как хакнуть этот баг в ИЕ, а не альтернативная вёрстка. К тому же в моём случае альтернативных вариантов нет. Есть только один вариант: запихнуть потомка под родителя. И ничего неверного я в этом не вижу, потому что абсолютный блок изымается из потока документа и может находится где угодно независимо от других элементов страницы.

Столкнулся с такой проблемой, что ИЕ не может опустить потомка под родителя. Например есть блок с z-index:1, внутри которого лежит position:absolute; z-index:-500. Все броузеры актуальных версий это отображают корректно, но ИЕ не может поставить -500 под 1. Это как-то лечится?

Совершенно неизвестно что туда вздумается вставить. Однако я всё больше склоняюсь к варианту с одной внешней таблицей. Остается открытым вопрос будет ли адекватно отображаться позиционирование блоков, если родитель — таблица. Как бы донести до рядовых пользователей, что ИЕ это полное гэ. Предлагаю изо всех сил рекламировать на всех ресурсах, где это только возможно, альтернативные броузеры

Да, <table> стараюсь похоронить. В тех местах, которые относятся к разметке страницы. Ибо, как вещают эксперты, нада разделять контент и его описание. Хотя на самом деле очень хотелось бы почитать мнение этих экспертов именно по данному вопросу. Неужто CSS ещё настолько несовершенны, что не позволяют реализовать таких элементарных вещей?

Да, да, да. Было очень много тем, где обсуждался футер внизу страницы. Но у всех тех решений есть один существенный недостаток: жестко прописывается высота футера. Между тем часто нельзя заранее узнать высоту футера. Например, есть у меня в футере несколько ссылок и высоты 50рх достаточно. Но завтра мне может понадобиться вставить туда кучку логотипов и высота увеличиться неизвестно на сколько. Просмотрел кучу ссылок, но решения с высотой футера, растягивающейся под контент, так и не нашел. Неужто его не существует? (без джабы)

Решение очень простое, но! У вашего решения высота футера должна быть фиксированной и от этого значения зависят ещё два параметра (margin-top для футера и padding-bottom для all'a). Так что такое решение не годится.

А вот и неправы вы. В первую очередь человек найдёт другой сайт...

2Searcher, inline и nowrap помогли. Спасибо :-) Видима раньше не в туда вставлял... Только margin перестали работать. Но это надеюсь поправимо.

2Victor, а если проверить прежде, чем советовать? :-) тоже не работает.

Вот код одного блока. Их там может быть порядка десяти. <div style="height:33px; position:relative; float:left; margin:0 5px 5px 0; background-color:#acb7be;"> <div style="float:left; margin:5px 2px 5px 5px;"> <input style="width:100px; margin:0; padding:0;" name="" type="text" /> </div> <div style="float:left; margin:5px 2px 5px 0;"> <input style="width:29px; height:23px; margin:0; padding:0;" name="" type="button" value="§" /> </div> <div style="float:left; margin:5px 2px 5px 0;"> <input style="width:29px; height:23px; margin:0; padding:0;" name="" type="button" value="§" /> </div> <div style="clear:both;"></div> </div> 2Victor. Не канает. все равно кнопочки сваливаются друг под друга если места им мало.