Hi,
wieso wird die Höhe bzw. die ganze Seite nur in Opera korrekt dargestellt?
grüße
wieso wird die Höhe bzw. die ganze Seite nur in Opera korrekt dargestellt?
grüße
HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
<head>
<title>test</title>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
<meta name="description" content="" />
<meta name="author" content="" />
<meta name="keywords" content="" />
<link href="style.css" type="text/css" rel="stylesheet" />
<link href="favicon.jpg" type="image/x-icon" rel="shortcut icon" />
</head>
<body>
<div id="wrap">
<div id="header">
<h1> <a href="#"> SCHWINDELFREY </a> </h1>
</div>
<div id="nav">
<ul>
<li class="button"> <a href="#"> LINK </a> </li>
<li class="button"> <a href="#"> LINK </a> </li>
<li class="button"> <a href="#"> LINK </a> </li>
<li class="button"> <a href="#"> LINK </a> </li>
<li class="button"> <a href="#"> LINK </a> </li>
</ul>
</div>
<div class="clear">
</div>
<div id="main">
<p> hiiihii</p>
</div>
<div id="side">
<li>
<li> Erstens </li>
<li> Erstens </li>
<li> Erstens </li>
<li> Erstens </li>
<li> Erstens </li>
<li> Erstens </li>
</li>
</div>
</div>
</body>
</html>
Code:
* {
margin: 0;
}
html, body
{
margin: 0;
min-height: 100%;
height: 100%;
background: #212121;
font-family: georgia;
}
.clear {
clear: both;
}
.button a {
color: red;
background: white;
}
.button a:hover {
color: silver;
background: #333;
}
#wrap {
margin: 0 auto;
width: 800px;
min-height: 100%;
height: 100%;
height: auto;
background: gray;
}
/* ----> HEAD <---- */
#header {
height: 150px;
background: #333;
}
#header a {
color: white;
text-decoration: none;
background-color: #212121;
padding: 10px;
}
/* ----> NAV <---- */
#nav {
background: silver;
}
#nav ul {
width: 80%;
}
#nav ul li {
float: left;
list-style: none;
width: 20%;
text-align: center;
}
/* ----> CONTENT <---- */
#main {
float: left;
min-height: 100%;
height: 100%;
height: auto;
width: 70%;
background: white;
}
#side {
min-height: 100%;
height: 100%;
height: auto;
float: right;
width: 30%;
background: #9AFFFF;
}