lanzs
-
Posts
4 -
Joined
-
Last visited
lanzs's Achievements
Explorer (1/14)
0
Reputation
-
Searcher, psywalker, спасибо! проблема была в "цифрах" исправил, все заработало
-
Пытаюсь сделать блоки шириной 50%, 1\3 (т.е. 33%) и 2\3 (т.е. 67%) Соответственно блоки 50% только между собой вставляются (лефт и райт) А блоки 1\3 и 2\3 компонуются между собой (лефт и райт) Проблема в следующем: почему-то после первого "третичного" блока перестает воспринимать стили... ошибку увидеть сам не могу Исходник HTML: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <link rel="stylesheet" rev="stylesheet" href="layout.css" /> </head> <body> <div id="wrapper"> <div id="container"> <div id="header"> <div class="half2left"></div> <div class="half2right"></div> <div class="clear"></div> <div class="2thirds2left"></div> <div class="third2right"></div> <div class="clear"></div> </div> <div id="center"> <div class="third2left"></div> <div class="2thirds2right"></div> <div class="clear"></div> </div> <div id="footer"></div> </div> </div> </body> </html> Стиль: @charset "utf-8"; /* CSS Document */ *, html { margin: 0; padding: 0; } #wrapper { width: 100%; height: 100%; } #container { width: 960px; margin: 0 auto; } /* Header goes here */ #header { width: 960px; } /* Center goes here */ #center { width: 960px; } /* Footer goes here */ #footer { width: 960px; } /* 50% parts */ .half2left { width: 50%; float: left; background: white; height: 100px; } .half2right { width: 50%; margin-left: 50%; background: green; height: 100px; } /* 1/3 parts */ .third2left { width: 33%; float: left; background: lightblue; height: 100px; } .third2right { width: 33%; margin-left: 67%; background: orange; height: 100px; } /* 2/3 parts */ .2thirds2left { width: 67%; float: left; background: brown; height: 100px; } .2thirds2right { width: 67%; margin-left: 33%; background: brown; height: 100px; } /* clear&fix */ .clear { clear: both; } *в результате, блоки должны иметь разные цвета (проверка такая работает ли стиль ), но они перестают "окрашиваться"
-
Спасибо, разобрался
-
Опять вопрос про height: 100%, а точнее про то, как сделать так, чтобы везде все работало Знаю, что проблема обсуждалась уже многократно, но что-то все никак не выходит, поэтому прошу помощи у тех, кто может помочь Верстаю сайт, задача: header фиксированный, футер тоже, сайт в высоту страницы, в середине content, у которого, в случае необходимости образовывается scroll. Т.е. хедер и футер всегда на странице, а между ними контент со скролом (если не влазит без него)... Вот пример того, что получилось (в IE работает как и задумано): http://show.lanzs.ru/7/ В IE все в порядке, в Opere - через js - при загрузке подгоняет размер content`а, а вот с FF ну никак не получается сделать.. Рецепты вроде этого: http://forum.htmlbook.ru/index.php?showtopic=11887 не совсем помогли Подскажите, как еще возможно это исправить далее упрощенный код html: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" /> <title>Галерея Олега Жогина</title> <link href="style.css" rel="stylesheet" type="text/css" media="screen" /> </head> <body onLoad="he()"> <div id="main"> <div id="header"> <h1><a href="index.html">Галерея Олега Жогина</a></h1> <div id="lang"><a href="?ru" class="now">ru</a> <a href="?en">en</a> <a href="?es">es</a></div> </div> <div id="content"> </div> <div id="footer"> <h3><a href="contacts.html">контакты</a></h3> </div> </div> </body> </html> Стиль: @charset "windows-1251"; /* CSS Document */ * { margin: 0; padding: 0; border: 0; } html, body { width: 100%; height: 100%; overflow: hidden; background: white; font-family: Geneva, Arial, Helvetica, sans-serif; font-weight: normal; } #main { position: relative; width: 100%; height: 100%; margin: 0; border: 0; background: white; } #header { height: 82px; border-bottom: 2px #333 solid; background: white; } #content { top: 84px; bottom: 60px; *height: expression(parentNode.offsetHeight - 144 + 'px'); overflow: scroll; scrollbar-3dlight-color: #999; /* #1: could be changed on white in pair with #3 */ scrollbar-arrow-color: #999; scrollbar-highlight-color: white; /* #3: could be changed on #999 in pair with #1*/ scrollbar-face-color: white; scrollbar-shadow-color: #999; scrollbar-darkshadow-color: white; scrollbar-track-color: white; } #footer { border-top: 2px #333 solid; background: white; } #clear { clear: both }