So mein Problem ist folgendes.
Ich bin dabei eines meiner Layouts umzusetzen, dies sieht bisher so aus:
http://myxotod.de/stuff/grafiken/problem.jpg
Hab grad erst angefangen es zu bauen, von daher kann ich euch auch gleich getrost den Code geben, den ich bisher geschrieben hab.
index.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" xml:lang="en" lang="en">
<head>
<title>Test</title>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<div id="wrapper">
<div id="header_box"></div>
<div id="info_bar"></div>
<div id="content">
<div id="content_top">
</div>
</div>
<div id="content_bottom"></div>
</div>
</body>
</html>
Alles anzeigen
style.css
* {
padding: 0;
margin: 0;
border: 0;
}
body {
background: #999999 url(body_bg.jpg) repeat-x scroll center top;
}
#wrapper {
margin-left: auto;
margin-right: auto;
width: 992px;
}
#header_box {
background: transparent url(header_bg.jpg) no-repeat scroll center 0;
height: 142px;
width: 992px;
}
#info_bar {
background: transparent url(info_bar.jpg) no-repeat scroll 0 0;
width: 992px;
height: 14px;
}
#content_top {
background: transparent url(content_top_bg.jpg) no-repeat scroll 0 0;
width: 992px;
height: 162px;
}
#content {
background: transparent url(content_bg.jpg) repeat-y scroll 0 0;
width: 992px;
}
#content_bottom {
background: transparent url(content_bottom_bg.jpg) no-repeat scroll 0 0;
width: 992px;
height: 18px;
}
Alles anzeigen
So wie ihr seht, der wrapper umschließt alles. Mein problem müsste beim body liegen. Bei dem Hintergrund. Dieser ist zentriert, genau wie der Wrapper. beim body hab ich es mit scroll center 0; gemacht und beim wrapper halt eben margin-left: auto; und margin-right: auto;.
Was mich nun sehr schockt ist, dass die headergrafik nicht mehr auf den hintergrund passt. Im Layout passt sie weil es ja eine Grafik ist die ich gebaut hab, aus der ich jetzt meine benötigten Teile ausschneide.
Kann mir jemand helfen? Da muss es doch sicherlich einen Trick geben wie ich das machen kann. Wenn es jemand weiß, dann helft mir bitte dabei.
Danke im voraus.