Hallo ludgerf321 hab mich nu mal schnell hier registriert
Sie mal, die Seite mit 1000px Gesamtbreite hat diesen HTML und Css Code:
HTML
<div id="head">
<ul id="werbelink">
<li><a href="">LINK</a></li>
</ul>
<ul id="headnavi">
<li>LINKS</li>
</ul>
</div>
<ul id="navi">
<li id="active"><a href="index.php" id="current">Startseite</a></li>
<li><a href="">Link2</a></li>
<li><a href="">Link3</a></li>
<li><a href="">Link4</a></li>
</ul>
<div id="leftboard"></div>
<div id="content">
<h1>Willkommen auf http://wdomain.de</h1>
<h2>Ihre Webseite im Internet</h2>
</div>
<div id="rightboard"></div>
<ul id="footer">
<li>LINK</li>
</ul>
Code
* {margin: 0; padding: 0;}
img {border: none;}
a {color: #fff; text-decoration: none;}
a:hover {
color: #fff;
text-decoration: underline;
}
body {
width: 900px;
margin: 0 auto;
background: #ff8844;
font-family: cambria;
color: #000;
}
#head {
height: 150px;
background-image: url(img/head.gif);
}
#leftboard {
width: 150px;
float: left;
margin: 20px 0 0 0;
}
#content {
width: 550px;
float: left;
margin: 20px 0 0 0;
}
#rightboard {
width: 180px;
float: left;
padding: 25px 0 0 20px;
}
ul#footer {
width: 100%;
height: 30px;
clear: both;
text-align: right;
color: #02a3ff;
}
ul#footer li {
display: inline;
}
ul#footer li a {
color: #000;
text-decoration: none;
padding-right: 8px;
}
ul#footer li a:hover {
color: #eee;
text-decoration: underline;
}
h1 {
font-size: 20px;
text-align: center;
color: #fff;
}
h2 {
font-size: 18px;
text-align: right;
color: #000;
padding: 8px 0 0 0;
font-family: calibri;
}
/* Headerwerbung Links */
ul#werbelink {
width: 280px;
height: 20px;
margin: 0 0 0 275px;
z-index: 1;
position: absolute;
font-size: 17px;
}
ul#werbelink li {
display: inline;
}
ul#werbelink li a {
color: #000;
}
ul#werbelink li a:hover {
color: #ff8844;
}
/* Headernavigation Rechts */
ul#headnavi {
width: 375px;
height: 20px;
margin: 17px 0 0 650px;
z-index: 2;
position: absolute;
color: #fff;
font-size: 12px;
}
ul#headnavi li {
display: inline;
margin-left: -4px;
}
ul#headnavi li a {
padding: 5px 10px;
color: #eee;
text-decoration: none;
}
ul#headnavi a:hover {
text-decoration: underline;
color: #ff8844;
}
/* Horizontale Hauptnavi */
ul#navi {
font-family: cambria;
font-weight: bold;
color: #fff;
text-align: center;
padding: 5px 0;
background: #0033ee;
border-top: solid 1px #ff8844;
font-size: 17px;
}
ul#navi li {
display: inline;
margin-left: -4px;
}
ul#navi li a {
padding: 5px 10px;
color: #fff;
text-decoration: none;
border-right: 1px solid #fff;
}
ul#navi li a:hover {
background-color: #ff8844;
color: #000088;
}
Mein Headerbild was sich dann anpassen soll ist 900 breit und 150 hoch. Wenn du diesen Code eins zu eins übernimmst siehst du wie es im FF und IE aussehen soll(ausser header ist ein Logo). Musst kurz ein eigenes bild nehmen.
Hoffe du weisst dann was ich mein, die Navis die schon über dem Header liegen sollen möglichst mitlaufig sein und erhalten bleiben.
An alle: Ich bin der unregistrierte der diesen Thread eröffnet hat
