Tja, ich wollte eine neue CSS-Seite bauen und bin auf folgendes Problem gestoßen.
Das Div "box6" wird nicht am rechten Rand angezeigt, sondern unter das Div "box5" geschoben. Welche Änderung ist notwendig, damit box 6 als rechtes Menu auch rechts am Rand klebt und nicht links unten drangequetscht wird?
HTML
Style.css
Das Div "box6" wird nicht am rechten Rand angezeigt, sondern unter das Div "box5" geschoben. Welche Änderung ist notwendig, damit box 6 als rechtes Menu auch rechts am Rand klebt und nicht links unten drangequetscht wird?
HTML
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=iso-8859-1" />
<title>SSV</title>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="box1">
<div id="box2"></div>
<div id="box3">
<div id="box4"></div>
<div id="box5"></div>
<div id="box6"></div>
</div>
</div>
</body>
</html>
Style.css
HTML:
/* CSS Document */
html, body{
font-family:Verdana, Arial, Helvetica, sans-serif;
background-color:#000000;
color:#000000;
font-size:10px;
text-align:left;
}
a:link {
font-weight:normal;
text-decoration:none;
color:#000000;
}
a:visited {
font-weight:normal;
text-decoration:none;
color:#FFFFFF;
}
a:hover, a:active {
color:#FFCC00;
}
#box1{ position:absolute; top:10px; left:10px; width:980px; height:560px; z-index:1; background:red; overflow:auto;}
#box2{ position:absolute; top:0px; left:0px; width:980px; height:150px; z-index:2; background:blue;}
#box3{ position:relative; top:150px; left:0px; width:980px; height:410px; z-index:2; background:yellow; overflow:auto;}
#box4{ position:absolute; bottom:0px; left:0px; width:980px; height:20px; z-index:2; background:white;}
#box5{ position:relative; top:0px; left:0px; width:150px; height:390px; z-index:2; background:green; overflow:auto;}
#box6{ position:relative; top:0px; right:0px; width:150px; height:390px; z-index:2; background:lime; overflow:auto;}