knell
-
Posts
4 -
Joined
-
Last visited
knell's Achievements
Explorer (1/14)
0
Reputation
-
нашел выход для ирода IE, добавил для него обертку <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html> <head> <style type="text/css"> * { background-color: #FFFFFF; margin: 0px; padding: 0px; } #all { margin: 0px; padding: 0px; left: 0px; top: 0px; } #header { height: 80px; margin: 10px 10px 0px 10px; border: 1px solid #000000; position: relative; } </style> <body> <div id="all"> <div id="header"> хидер </div> </div> </body> </html> теперь он реагирует на правую границу. И, по-моему, понял, почему не реагировал раньше для IE body не блочный элемент добавил body { display: block; } и слои, у которых есть свойство right: 10px;, тут же растянулись на всю ширину.
-
хм-хм, block для надежности, я уже разуверился в IE вот простой пример <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html> <head> <style type="text/css"> body { background-color: #FFFFFF; margin: 0px; padding: 0px; } #header { height: 80px; margin: 10px 10px 0px 10px; width: 100%; border: 1px solid #000000; } </style> <body> <div id="header"> хидер </div> </body> </html> слой уезжает за правую границу. Если в FF указать: right: 10px; то этот хороший браузер отрисовывает блок так, как нужно, с отступом в 10 пикселей справа, так как написано в стандарте. А плохой IE просто не реагирует на right и при width: 100%; точно так же растягивает блок за пределы окна. Ширина блока равна ширине страницы, учитывая отступы, блок съезжает.
-
о! пасибочки правый слой стал как нужно. теперь второй вопрос в FF все чудно, а в IE слои header и links сжались по размеру содержимого. Получается вот что #header_div { border:1px solid #000000; color:#990000; font-family:Helvetica; font-size:18pt; height:80px; left:10px; right:10px; top:10px; display:block; position:absolute; } каким образом заставить этот убогий IE растянуть слой на всю ширину ?
-
есть такая разметка страницы <html> <head> <style type="text/css"> body { background-color: #FFFFFF; } #header_div, #links_div { position: absolute; display: block; } #header_div { font-family: Helvetica; color: #990000; font-size: 18pt; height: 80px; right: 10px; left: 10px; top: 10px; } #links_div { left: 10px; right: 10px; top: 100px; text-align: right; background-color: #FFE0E5; } #menu_div, #main_div, #right_div { position: absolute; display: inline-block; } #body_div { display: block; position: absolute; top: 150px; left: 10px; right: 10px; } #menu_div { width: 200px; left: 0px; top: 0px; position: relative; } #main_div { left: 210px; top: 0px; right: 250px; min-width: 650px; } #main_div #submenu { position: relative; left: 0px; top: 0px; display: block; padding: 5px 5px; margin-bottom: 10px; border: 1px solid #990000; text-align: justify; } #main_div #banners { display: block; height: 100px; min-height: 100px; max-height: 100px; padding: 5px; background-color: #FFF0F5; margin: 3px 0px; overflow: hidden; } #main_div #content { display: block; } #right_div { width: 240px; top: 0px; right: 0px; } #copy { position: absolute; display: block; left: 10px; right: 10px; padding: 15px 0px; } </style> </head> <body> <div id="header_div"> This is a header and top banner </div> <div id="links_div">Here are links that are not from a catalog</div> <div id="body_div"> <div id="menu_div"> There are menu items </div> <div id="main_div"> <div id="submenu"> These are subitems </div> <div id="banners"> Advertisment banners </div> <div id="content"> here is a main content </div> </div> <div id="right_div"> This is a right column: news, announcements, etc. </div> <div id="copy">Copyright</div> </div> </body> </html> в Firefox 2.х отображается все чудно и правильно, в IE же све смещено в левую часть, друг на друга подскажите, в чем поблема ???