nicht angemeldet
Hallo Forum
Ich habe ein CSS Problem und komme nicht dahinter:
im body hab ich einen Verlauf mit 1 px breite (repeat-x) und im ersten <div> einen Schatten und ich schaffe es nicht den backround im div so zu platzieren das es im IE und FF deckungsgleich ist.
Entweder es geht im FF oder im IE.
Der FF beginnt nicht bei 0px da muss ich
background-position: center -10px;
eingeben das es wirklich oben steht. Der IE interpretiert das richtig und verschiebt es.
Wenn ich background-attachment: scroll; verwende passt die Position in beiden browsern nur will ich das nicht bzw wenn dann gescrollt wird stimmt es im IE nicht mehr.
Hier der Code der Seite:
<!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>Unbenanntes Dokument</title>
<link href="css/basic.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="shadow">
<div id="main">
<div id="header"></div>
<div id="breadcrumb">breadcrumb</div>
</div>
</div>
</body>
</html>
und hier der Code des CSS:
* {
margin: 0px;
padding: 0px;
}
html{
height: 100%;
}
body {
background-color: #000000;
background-image: url(../images/hg_verlauf.gif);
background-repeat: repeat-x;
height: 100%;
margin: 0px;
background-attachment: scroll;
background-position: center top;
}
#shadow {
background-repeat: no-repeat;
background-image: url(../images/shadow.gif);
width: 1015px;
margin-right: auto;
margin-left: auto;
margin-top: 0px;
padding: 0px;
background-attachment: scroll;
background-position: center top;
}
#main {
width: 955px;
margin: 10px 30px 0px;
height: 650px;
}
#header {
height: 140px;
width: 955px;
color: #CCCCCC;
background-image: url(../images/hg_header_allgemein.gif);
background-repeat: no-repeat;
background-position: center top;
}
#breadcrumb {
padding-right: 20px;
padding-left: 20px;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 12px;
padding-top: 5px;
padding-bottom: 5px;
}
Mit dank im vorraus