Hallo Leute
Ich kriegs einfach nicht hin mein CSS layout so zu coden das das Submenu 100% hoch wird! Ich hab nun schon diverse Beiträge zu dem Thema gelesen, finde den fehler aber einfach nicht... Könnt ihr mir helfen?
Hier der CSS-Code:
Und hier das HTML:
Danke für jede Hilfe!
Ich kriegs einfach nicht hin mein CSS layout so zu coden das das Submenu 100% hoch wird! Ich hab nun schon diverse Beiträge zu dem Thema gelesen, finde den fehler aber einfach nicht... Könnt ihr mir helfen?
Hier der CSS-Code:
Code:
body {
width:100%;
margin:0 auto;
text-align:center;
}
#header {
/* DIVformatierung */
overflow:hidden;
height:50px;
width:100%;
display:inline-block;
background-color:#FFFFFF;
/* Textformatierungen */
padding-top:10px;
text-align:center;
font-size:28px;
font-family:Arial;
font-weight:bold
}
#menu {
/* DIVformatierung */
overflow:hidden;
display:inline-block;
height:70px;
width:100%;
background-image:url(../graphics/header_background.jpg);
border-bottom: 1px solid black;
/* Textformatierungen */
text-align:left;
}
#content {
/* DIVformatierung */
overflow:hidden;
display:inline-block;
height:100%;
width:79.9%;
float:left;
/* Textformatierungen */
text-align:left;
}
#sub-section{
/* DIVformatierung */
float:right;
margin:0px;
padding:0px;
right:0px;
bottom:0px;
visibility:visible;
background-image:url(../graphics/sub-section_background.jpg);
background-repeat:repeat-y;
background-color:#004F00;
width:20%;
height:100%;
/* Textformatierungen */
text-align:left;
color:#FFFFFF;
}
#div-text{
padding:25px;
}
#footer {
/* DIVformatierung */
overflow:hidden;
display:inline-block;
height: 50px;
vertical-align:bottom;
bottom:0px;
left:0px;
right:0;
border-top:1px solid black;
widt:100%;
clear:left;
/* Textformatierungen */
text-align:left;
}
Und hier das HTML:
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>New Project</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="../css/layout.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="header">New Project</div>
<div id="menu">_</div>
<div id="sub-section">
<p id="div-text">Die Klasse 1L </p>
</div>
<div id="content"><p id="div-text">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Fusce ut lacus. Mauris in elit. Praesent vehicula lobortis orci. Fusce ac turpis ac sapien molestie aliquam. Sed sit amet augue. Integer posuere lorem at libero. Quisque et sem non magna aliquet rhoncus. Mauris eros odio, mattis vestibulum, facilisis et, consequat eu, dui. Nulla ac libero eu metus sollicitudin dapibus. Donec vitae metus. Mauris nec leo id risus sodales elementum. Fusce ornare felis. Pellentesque fringilla hendrerit arcu. Nunc velit. Aliquam quis mauris eget pede gravida ultrices. Etiam varius nunc porttitor eros. Vivamus arcu. Phasellus ipsum sem, elementum in, elementum quis, porttitor eget, lacus. Sed interdum nisi vitae magna. In a nibh.
Fusce turpis. Donec feugiat. Aenean ultricies, est id eleifend posuere, enim orci varius sapien, vitae placerat justo dolor eget neque. Quisque congue porta dui. In hac habitasse platea dictumst. Praesent eros tellus, fermentum lobortis, semper et, commodo sit amet, ante. Sed diam. Quisque suscipit, urna porta rhoncus iaculis, nunc enim volutpat sem, ut ullamcorper massa massa tincidunt augue. Fusce congue, dui at blandit cursus, ante dolor cursus odio, non blandit dui erat et lectus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Proin sit amet est. Vivamus a nunc a felis ultrices egestas. Sed non urna. Nam id lectus. Nam in mi. Donec tristique. Ut ac odio faucibus lorem iaculis feugiat.</p> </div>
<div id="footer">Footer</div>
</body>
</html>
Danke für jede Hilfe!