klierik

странно... оч странно.. какой-то страный доктайп чтоли... я так и не смог привести сие чадо в валидный вид полностью. я вообще удалил все содержимое с формы а он все равно ругался.... о0

интересный топ. сразу зреет вопрос - откуда данный скрипт вообще появляеться на страницах??!

Приветвую, ув. посетители форума и администрация. первым делом я заюзал поиск для поиска топа с подобныс сабжом, но он мне ничего не выдал. Соответственно хотелось б поднять данный вопрос на обсуждение. Использование хаков, как я понял прочитав некоторое кол-во статеек/блогов нерекомендовано использовать в силу того что неизвестно что они могут принести в будущем. Ведь, собственно css hack - это ошибки в программе, которые допустили разработчики при разработке браузера, что в свою очередь не факт что они остануться при выходе следующего патча, что в свою очередь приведет к неработоспособности хака, или вообще его использование в абсолютно иных целях, нежели кодил разработчик. Хотя с другой стороны для написание хорошей кроссбраузерной верстки довольно сложно и за частую и невозможно. Ведь написав код добиться его идеальной отображаемости на страницах кроссбраузерно стоит не мало усилей от разработчика. Для помощи решения данных проблем кодеры используют css хаки да бы подогнать код. Многие разработчики с мировым именем утверждают что использование хаков - зло, и что вполне возможно написать код согласно стандартам без использования онных. От части я вполне с ними согласен, но за сим может последовать решение которое выльется в увеличение кода, а за сим и понижение читабельности и повышения размера страницы. Я не буду оспаривать мнение знаменитых кодеров, но в свою очередь поделюсь своим мнением по данному вопросу. Мне кажется что использование css hack`ов вполне допустимо для браузеров предыдущих версий, к примеру для IE6-, Opera 8-, FF 1.5-, и т.д. Их использование тут совершенно целесообразно, так как используя хаки для соответствующих версий можно добиться красивого, а главного кроссбраузерного отображение контента. На ряду в сравнении с остальными браузерами, IE, на удивление имеет преимущество, а именно он поддерживает expression, хотя, использование также не рекомендуемое в CSS. Разрабатывая код и сравнивая его в последних версиях браузеров, IE7, FF2, Opera 9, Safari for windows уже можно лицезреть кардинальные доработки на схожеть рендеринга страницы, но все же есть некоторые "разногласия" между браузерами, к примеру в отступах, размерах объектов форм, или позиционировании одного объекта относительно другого. Использование хаков для "подгона" объекта бывает необходимо для изменение его местонахождение всего на пару пикселов. В общем не буду сильно углубляться в сабж а вынесу пока его на рассмотрение аудитории. зы: в одной из ранее создаваемой мною теме была задета тема про хаки, но они так и не были выложены. Думаю будет интересно тем, кто с ними не сталкивался или впервые про них услышал. html:first-child .class { /* for opera. проверенно в 9й (в 9,5 альфа неработает) */ /**/ } .class, x:-moz-any-link { /* for firefox. проверенно в 2й */ /**/ } body:first-of-type .class { /* for safari. проверенно на бете под windows */ /**/ } .class { /* for ie6 */ _property:value; } *:first-child+html .class { /* for ie7 */ /**/ } на днях наткнулся на карту хаков под множество систем и соответствующие браузеры (а так же версии браузеров) но к сожелению не смог найти у себя в хистори

я в соседнем топе выкладывал логику написания данных структур http://forum.htmlbook.ru/viewtopic.php?pid=35327#p35327 ознакомьтесь, пожалуйста с предоставленным кодом. вот такой структурой вы можете описать верх, центр, низ и все будет красиво, и что главное кроссбраузерно и не требует использования float. если не разберетесь, могу выслать шаблончик на мыло

ну к примеру.. есть селект: <select style="width:256px;"></select> так вот.. его ширина как мы видем 256пк. если он будет содержать option, у которого длтна текста будет больше етих 256пк <select style="width:256px;"> <option>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</option> </select> то во всех браузерах он будет отображаться нормально, а именно ширина выпадающих полей будет равна ширине самого длинного поля. IE же в свою очередь. в тупую, обрезает ширину option до ширины select`a мною выше предоставленный хак позволяет от этого избавиться для IE6 (скорее и ниже) IE7, к сожалению, на данный хак неведеться. Собственно вот такая тема на обсуждение

а на ШТМЛ код можно взглянуть? так как в ЦСС вроде все в норме

ээээ... а вы собственно о чем щас?

приветствую. такой трабл.. есть select с фиксированной шириной любой браузер содержащиеся в нем оптионы растянет на ширину текста. конешно же кроме IE. таблетку против ИЕ6 нашел: <style> behavior:expression(window.dropdown_menu_hack!=null?window.dropdown_menu_hack(this):0); </style> но в ИЕ7 оно уже несрабатывает ((( у когото есть соображения?!

у меня изза того что все вложенно друг в друга внутренние дивы просто == ширине самого рисунка внешнего. в общем дурной етот ие6 ((( невсегда можно на него найти управу. может просто есть иные возможности с емулировать подобную задачу пуска даже с яваскриптом ??!

html <!-- button --> <div class="button"> <!-- top side --> <div class="top"> <div class="l"><div class="r"><div class="c"></div></div></div> </div> <!-- middle side --> <div class="mdl"> <div class="l"><div class="r"><div class="c"> <!-- content here --> </div></div></div> </div> <!-- button side --> <div class="btn"> <div class="l"><div class="r"><div class="c"></div></div></div> </div> </div> <!-- /button --> вот собственно сам контейнер. каждая его часть разбита на 3 части - левая, правая, центр. так же и по высоте - верх, сентер, низ. css: .button, .button * { margin: 0px; padding: 0px; font-size: 0px; } /* top */ .button .top .l, .button .top .r, .button .top .c { height: 10px; } .button .top .l { background: url(../dev/img/round-shadow_tl.png) left top no-repeat; } .button .top .r { margin-left: 10px; padding-right: 10px; background: url(../dev/img/round-shadow_tr.png) right top no-repeat; } .button .top .c { background: url(../dev/img/round-shadow_tc.png) left top repeat-x; } /* middle */ .button .mdl .l, .button .mdl .r, .button .mdl .c { /*height: 10px;*/ } .button .mdl .l { /*background: url(../dev/img/round-shadow_ml.png) left top repeat-y;*/ } .button .mdl .r { margin-left: 10px; padding-right: 10px; /*background: url(../dev/img/round-shadow_mr.png) right top repeat-y;*/ } .button .mdl .c { /*background: url(../dev/img/round-shadow_tl.png) left top repeat-x;*/ } /* button */ .button .btn .l, .button .btn .r, .button .btn .c { height: 10px; } .button .btn .l { background: url(../dev/img/round-shadow_bl.png) left top no-repeat; _background: none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../dev/img/round-shadow_bl.png'); } .button .btn .r { margin-left: 10px; padding-right: 10px; background: url(../dev/img/round-shadow_br.png) right top no-repeat; position: relative; _background: none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../dev/img/round-shadow_br.png'); } .button .btn .c { position: relative; background: url(../dev/img/round-shadow_bc.png) left top repeat-x; _background: none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../dev/img/round-shadow_bc.png', sizingMethod='scale'); } /* content */ .button .mdl .c p { font: normal 12px tahoma; color: #444; padding: 12px; } тут описываеться ето все чудо. контент может тянуться по высоте и тянуть контейнер вниз в данный момент внизу фильтры включены для ie6, собственнно что и надо! но так как изза вложенности и того что надо растянуть низ ничего неработает ((( думаеться мне что нереально реализовать данный вопрос для ИЕ6, без кучи яваскрипта, что в данном случае непозволительно. собственно сама задача какая... для примера можно в фотошопе просто нарисовать квадрат, и пустить outer glow - 5px, к примеру, и получитсья как раз то что я пытаюсь сверстать, при умете что все граничные рисунки должны иметь прозрачность. гиф тут, к сожелению, неподходит.

выстави фиксированную ширину. он будет тянутсья вниз

не. ему все равно (( у меня 3 вложеных один в один дива с бекграундами пнг - левый угол, правй, центральная часть. для центральной через фильтр включаеться сквиз(растяжка). первый(верхний) отображаеться как надо, остальные с багами. может есть просто иной способ как можно реализовать теня для контейнера, с учетом что она распологаеться со всех сторон? высота контейнера вытягеваеться ко контенту!

так код div.one { height: 100%; } должен сработать для таблицы с 3мя колонками =) для боковых указываеться соответствующий бекграунд

вы хотите что б высота контента с футером == высоте окна??! что б футер всегда был виден?! в общем я кажется понял что именно вам надо. высота так выставляеться через js -> offsetHeight (вроде так можно узнать высоту окна) и полученное значение просто довавить в стайл соотв дивов

почитай на сайте откуда будешь брать ети рисунки. там должен быть код. или ты хочешь что б твой сайт сам делал свои графики?!

да.... хм... а если так: <div style="background:red;"><!-- left colum --> <div style="background:red; margin-left:10px; padding-right:10px;"><!-- right colum --> <div style="background:green; height:1024px;"><!-- content--></div> </div> </div> если и ето не то. тогда вы некорректно огвариваете что именно вам нужно!!!!!! зы: в ваше указаном коде стоит удалить класс .top так как он не нужен в даном случае. сорри, провтыкал удалить.

очень просто html <!-- button --> <div class="button"> <div class="l"><div class="r"><div class="c"> <!-- CONTENT --> </div></div></div> </div> <!-- /button --> css /*** button ***/ .button, .button * { margin: 0px; padding: 0px; font-size: 0px; } .button .top .l { background: url(../dev/img/round-shadow_tl.png) left top no-repeat; } .button .top .r { margin-left: 10px;/*ширина левой колонки */ padding-right: 10px;/* ширина правой колонки*/ background: url(../dev/img/round-shadow_tr.png) right top no-repeat; } .button .top .c { /* контент */ } зы: брал за основу код с кнопки... но логика едентична!!!

http://htmlbook.ru/css/overflow.html ??! или я не очен понял о чем речь ))

в цсс ставишь такое: * { _width: font-size:0px; } схаваеться только ИЕ6. трабл в том что он отступ палюбе поставит размеров с сам шрифт. вот как )))

да бы не открывать новый топ, по столь раз обсуждаемой теме, пишу в одной из подобных тем используя AlphaImageLoader filter на внешний див, все внутренние перестают отображаться виден только главный. ето можно как-то побороть??!

растяжка центрального контейнера происходит именно через яваскрипт! средствами css ето врядли решаемо.

К сожалению, данная страница для Вас не доступна, возможно был изменен ее адрес или она была удалена. Пожалуйста, воспользуйтесь поиском. 2 автор. решили поприкалываться?!:/

кривая верстка вероятнее всего. попробуйте переписать все с нуля.. так как искать баг можно продолжительное время. так же рекомендовал б вам во время верстки одновременно сверять сразу во всех браузерах на которые вы позиционируете, да бы потом не возникали подобные проблемы

используй хаки. есть специальные обозначения которые читаються соответствующими браузерами. касательно второго... ошибка в яваскрипте скорее всего! в чем он заключаеться подсказать немогу. иди на форум разработчиков от FireFox на офф сайте. там спроси. а про отступ - кравая верстка скорее всего!

весьма..весьма благодарен за код. я, правда, пока не понял как он работает... буду разбираться. еше раз спасибо.