Frage stellen
ich fange gerade erst mit css an und bin auf ein Problem gestossen, das ich leider trotz intensiver Suche und mehreren Versuchen nicht lösen konnte.
Ich habe zwei divs (im Code die divs "header" und "bottom") die untereinander liegen.
Im FF funktioniert alles problemlos aber im IE gibt es leider eine kleine Lücke, vielleicht 2 px oder so zwischen den beider divs. Gibt es irgendeine Möglichkeit diese loszuwerden?
Bin für jede Hilfe dankbar.
mfg,
Benjamin
Hier der Code:
- Code: Alles auswählen
<html>
<head>
<link rel="stylesheet" type="text/css" href="./style.css" media="screen" />
</head>
<body>
<div id="outer">
<div id="header">
<div id="logo">
<img src="./images/logo_kaufmann.jpg">
</div>
</div>
<div id="bottom">
<div id="navbar">
</div>
<div id="content">
</div>
</div>
</body>
</html>>
und hier das CSS
- Code: Alles auswählen
* {
margin:0px;
padding:0px;
}
body {
background-image:url('./images/bg.jpg');
background-color:#660000;
background-repeat:repeat-x;
font: 14px Arial, Helvetica, sans-serif;
height:100.01%;
text-align:center;
}
#outer {
min-height:100.01%
height: auto;
height:100.01%;
background-color:white;
width:800px;
margin:0 auto;
}
#header {
position:relative;
background-image:url('./images/top_bg.jpg');
width:800px;
height:150px;
background-repeat:no-repeat;
}
#logo {
margin-left:25px;
float:left;
}
#bottom {
float:left;
background-image:url('./images/bottom_bg.jpg');
background-repeat:no-repeat;
width:800px;
}
#navbar {
float:left;
border-top-width:20px;
border-top-style:solid;
border-color:#ffcc33;
margin-top:20px;
width:150px;
height:400px;
background-color:white;
margin-left:25px;
text-align:left;
}
#navbar li {
list-style-type:none;
line-height:2;
}
#content {
border-top-width:20px;
border-top-style:solid;
border-color:#ffcc33;
padding-left:20px;
padding-right:10px;
float:left;
margin-top:20px;
margin-left:5px;
padding-top:20px;
background-color:white;
width:585px;
line-height:2;
text-align:left;
}