nicht angemeldet
Hi,
wie bekomme ich folgendes CSS-Layout hin? Habe noch nicht viele CSS-Layouts erstellt.
CSS-Datei:
body {
background:#000000;
text-align:center;
}
div#top-cont {
position:absolute;
top:20px;
width:800px;
height:200px;
}
div#top-lila {
position:absolute;
top:0px;
width:800px;
height:100px;
background:#800080;
}
div#top-dlila {
position:absolute;
top:100px;
width:800px;
height:100px;
background:#400040;
}
div#top-logo {
position:absolute;
top:39px;
width:240px;
height:122px;
z-index:1;
text-align:right;
}
div#main-cont {
position:absolute;
top:240px;
width:800px;
height:500px;
background:#ffffff;
}
div#main-left {
position:relative;
top:0px;
width:250px;
height:500px;
float:left;
background:#ffffff;
}
div#main-center {
position:relative;
top:10px;
left:10px;
right:10px;
width:3px;
height:480px;
float:left;
background:#000000;
}
div#main-right {
position:relative;
top:0px;
width:527px;
height:500px;
float:right;
background:#ffffff;
}
div#footer {
position:absolute;
top:740px;
width:800px;
height:50px;
background:#800080;
}
HTML-Datei:
<html>
<head>
<title>Testlayout</title>
<link rel="stylesheet" type="text/css" href="layout.css">
</head>
<body text="#000000" bgcolor="#FFFFFF" link="#FF0000" alink="#FF0000" vlink="#FF0000">
<div id="top-cont">
<div id="top-logo"><img src="test.jpg" width="240" height="122" border="0" alt="" id="top-logo"></div>
<div id="top-lila"></div>
<div id="top-dlila"></div>
</div>
<div id="main-cont">
<div id="main-left"></div>
<div id="main-center"></div>
<div id="main-right"></div>
</div>
<div id="footer"></div>
</body>
</html>
MfG
HP-Bauer