Hallo Leute,
ich bin noch ein newbie in Sachen Webdesign, aber ich kämpf mich durch
Hier mein Problem vereinfacht:
Drei Boxen
Header-Box mit 100px.
Content-Box mit 500px.
Und eine dritte Box, die Logo heißt mit 200px.
Logo-Box soll Header komplett überlappen und Content-Box 100px
überlappen.
Ich habe rumprobiert, gesucht usw. nix richtiges gefunden für den ie6
Der ie6 überlappt Header komplett aber nicht Content sondern drückt
Content runter so dass ich zwischen Header und Content einen
Zwischenbereich habe.
Ich will aber, dass Content auch überlappt wird.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="de" xml:lang="de">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- -->
<script type="text/javascript" charset="utf-8">/*<![CDATA[*/
/*]]>*/</script>
<style type="text/css">
body {
background-color: #ffffff;
color: #000000;
font-family: Georgia, "Trebuchet MS", Verdana, Arial, Sans-Serif;
text-align: center;
}
* {
border: 0;
margin: 0;
outline: 0;
padding: 0;
}
#container {
background: transparent;
height: 100%;
width: 100%;
}
#header {
background-color: green;
height: 100px;
width: 100%;
margin: 0px auto;
z-index: 1;
position: relative;
}
#logo {
background-color: red;
border: 1px solid white;
height: 260px;
width: 700px;
margin: 0px auto;
z-index: 3;
position: relative;
}
#bodyContent {
background-color: yellow;
border: 0px solid white;
height: 306px;
width: 100%;
margin: 0px auto;
z-index: 2;
position: relative;
}
</style>
<title> title </title>
</head>
<body>
<div id="container">
<div id="header">
</div>
<!-- header end -->
<div id="logo"></div>
<div id="bodyContent">
</div>
<!-- bodyContent end -->
</div>
</body>
</html>
------------------
Danke für eure Hilfe. Ich komme leider nicht weiter.
Felix