|
|
| Тема |
 Re: CSS bottom menu, frame-like [re: Vox] |
|
| Автор |
dimodi (...) |
|
| Публикувано | 03.02.07 23:53 |
|
|
|
Дано под "само с CSS" имаш предвид "без таблици", Защото ползвам javascript за тоя фокус, без javascript не се сещам как може да стане.
Ако има нещо неясно - питай :)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xml:lang="bg" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta http-equiv="content-language" content="bg" />
<title>Bottom menu</title>
<style type="text/css" media="screen">
*{margin:0;padding:0}
html,body{height:100%;overflow:hidden}
#menu{position:absolute;left:0;bottom:0;background:#ffc;width:100%;height:100px;z-index:2}
#wrp{overflow:auto;background:#ddd}
p{margin-top:1.2em}
</style>
<script type="text/javascript">
function setHeight()
{
document.getElementById('wrp').style.height = (document.documentElement.offsetHeight - 100) + 'px';
}
</script>
</head>
<body onload="javascript:setHeight();">
<div id="wrp">
<p>Lorem ipsum</p><p>Lorem ipsum</p><p>Lorem ipsum</p><p>Lorem ipsum</p>
<p>Lorem ipsum</p><p>Lorem ipsum</p><p>Lorem ipsum</p><p>Lorem ipsum</p>
<p>Lorem ipsum</p><p>Lorem ipsum</p><p>Lorem ipsum</p><p>Lorem ipsum</p>
<p>Lorem ipsum</p><p>Lorem ipsum</p><p>Lorem ipsum</p><p>Lorem ipsum</p>
<p>Lorem ipsum</p><p>Lorem ipsum</p><p>Lorem ipsum</p><p>Lorem ipsum</p>
<p>Lorem ipsum</p><p>Lorem ipsum</p><p>Lorem ipsum</p><p>Lorem ipsum</p>
</div><!--wrp-->
<div id="menu">
div id="menu"
</div><!-- menu-->
</body>
</html>
| |
| |
| 
|
|
