Я занимаюсь редизайном этого сайта: http://puffandpass.co.za/
с этим дизайном:
http://puffandpass.co.za/incubator/ (это не полностью, эй ..)
Дизайн имеет следующую структуру:
<html>
<body>
<div id="wrapper">
<div id="page">
*//content goes here*
</div>
</div>
</body>
</html>
Теперь вот мой CSS для каждого из приведенных выше тегов:
html, body {
color: #000;background: #3B5998;
font: 10px Helvetica, Arial, Verdana,sans-serif;
height: 100%;
line-height: 1.5em;
text-align:center;
}
#wrapper {
background: none repeat scroll 0 0 #123569;
border: 0.5em solid #123569;
height: 100%;
margin: 0 auto;
width: 102.4em;
}
#page {
background: none repeat scroll 0 0 #FFFFFF;
float: left;
text-align: center;
width: 102.4em;
}
[Проблема] Высота тегов html, body
(и, следовательно, #wrapper
) ограничивается видимой областью экрана.Это означает, что содержимое тега #page
выходит за пределы #wrapper
. Высота становится хуже (меньше), когда у меня открыт Firebug.
Вопрос: Что я делаю не так?
Заранее спасибо.
М