nicht angemeldet
Header an Hintergrund anpassen?
Hallo,!!
Ich habe ein Problem mit meiner Seite, wollte jetzt ein neues Layout erstellen mit einem Header (logisch) und einem Hintergrundbild, dass sich an das Ende vom Header anpasst und nach unten hin weiter läuft. Das Problem ist, dass sich alles immer verschiebt. Der Code ist etwas durcheinander, weil ich schon so viel herumprobiert habe, aber es sich nie ändert -.-
Die zweite Sache wäre: Ich möchte den gesamten Stylebereich in die style.css auslagern, also sowas wie im body gar nicht stehen haben. Wie mache ich das??
hier die Seite: http://federbuch.de.vu/indexneu.php
der indexcode:
<html>
<head>
<link href="styleneu.css" rel="stylesheet">
</head>
<body background="contentneu.png" background-repeat="repeat-y">
<!--- Navi Anfang -->
<img src="headerneu.png" alt="" border="0" width="1920" height="770" usemap="#1821035">
<map name="1821035">
<area shape="rect" coords="739,624,795,683" href="indexneu.php" alt="" target="_self">
<area shape="rect" coords="818,624,870,682" href="me.php" alt="" target="_self">
<area shape="rect" coords="897,625,951,682" href="review.php" alt="" target="_self">
<area shape="rect" coords="977,623,1025,684" href="" alt="" target="_self">
<area shape="rect" coords="1054,625,1103,684" href="" alt="" target="_self">
</map>
<!--- Navi Ende--->
<!--- Inhalt Anfang--->
<div id="inhalt">
</div>
<!--- Inhalt Ende--->
<!-- <div id="footer">
</div> -->
</body>
</html>
und die css.datei
#background {
width: 100%;
background: url('contentneu.png') center repeat-y;
}
#hintergrund {
text-align: left;
margin: 0px auto;
width: 1920px;
}
#header {
background: url('headerneu.png') no-repeat;
margin: 0px;
width: 1920px;
height: 770px;
padding: 0px 0px 15px;
}
body {
color: #000000;
font-family: century gothic;
font-size: 11px;
line-height: 10px;
scrollbar-arrow-color: #ffffff;
scrollbar-track-color: #000000;
scrollbar-face-color: #000000;
scrollbar-highlight-color: #000000;
scrollbar-3dlight-color:#000000;
scrollbar-darkshadow-color: #000000;
scrollbar-shadow-color:#000000;
letter-spacing: 0px;
cursor: default;}
h2{
display: block;
font-family: arial;
font-size: 10px;
color: #D24764 ;
text-decoration: none;
text-transform: uppercase;
line-height: 10px;
text-align: left;
letter-spacing: 3px;
border-bottom: 3px double #D24764 ;}
h3{
font-size: 17px;
font-family: "georgia",serif;
color: #73565E ;
font-style: italic;
text-transform: none;
line-height: 10px;
text-align: center;
letter-spacing: 2px;
border-bottom: 3px single #73565E ;}
h4{
font-size: 17px;
font-family: "georgia",serif;
color: #73565E ;
font-style: italic;
text-transform: none;
line-height: 10px;
text-align: left;
letter-spacing: 2px;
border-bottom: 3px single #73565E ;}
a:link {color: #B24A70; text-decoration: none;}
a:visited {color: #B24A70; text-decoration: none;}
a:hover {color: #73565E; text-decoration: underline;}
blockquote {
background-color: #E5D9FF;
margin: 0 55px;
padding: 0 10px;
border: 2px solid #D6CAF0;
}
u{
color:#A56377;
font-family: century gothic;
text-decoration: underline;}
i{
color:#AF7E92;
font-family: century gothic;}
b{
color:#D888A0;
font-family: century gothic;}
s{
color:#C41B4E;
font-family: century gothic;
text-decoration: line-through;}
.news1 {
width: 400px;
margin: 0px auto;
padding: 4px;
background: #fff4ef no-repeat;
border-top: 1px #9b9b9b solid;
border-bottom: 1px #dadada solid;
text-align: justify;
}
.newsava {
padding: 10px;
margin: 4px;
float: left;
}
.news2 {
width: 400px;
margin: 0px auto;
padding: 2px;
background: #fffff;
}
.news-comments {
background-color: #fff4ef;
border-top: 1px solid #dadada;
padding: 4px;
margin: 3px auto;
text-align: center;
width: 400px; }
Danke für eure Hilfe! Ihr könnt mir auch gerne per Mail schreiben :)