Hallo,
ich habe mir eine Homepage erstellt und diese ist auch mit dem Internet Explorer genau so zu sehen, wie es sein sollte.
Firefox zeigt allerdings die Hintergrundfarbe nicht an und verwendet eine serifenhaltige Schrift. Außerdem ist das Design bei der Navigationsleiste anders.
Hier meine Quelltexte:
HTML:
<html>
<head>
<link rel="stylesheet" type="text/css" href="design.css" />
</head>
<body>
<div id="kopfbereich">
</div>
<div id="steuerung">
<ul>
<li><a href="index.htm"><font color="#FF6600">Startseite</font></a></li>
<li><a href="ueber_mich.htm"><font color="#FF6600">Über mich</font></a></li>
<li><a href="friends.htm"><font color="#FF6600">Friends</font></a></li>
<li><a href="hobbies.htm"><font color="#FF6600">Hobbies</font></a></li>
<li><a href="musik.htm"><font color="#FF6600">Musik</font></a></li>
<li><a href="bilder.htm"><font color="#FF6600">Bilder</font></a></li>
<li><a href="kontakt.htm"><font color="#FF6600">Kontakt</font></a></li>
<li><a href="links.htm"><font color="#FF6600">Links</font></a></li>
</ul>
</div>
<div id="inhalt">
<br /> <br />
Hier steht der Inhalt
<div id="footer">
Fußzeile
</div>
</div>
</body>
</html>
CSS:
<style type="text/css">
<!--
body {
font: 100.00% Verdana, Arial, Helvetica, sans serif;
background-color: #F57D31;
}
#seite {
width:100%;
margin: 0 auto;
}
#kopfbereich {
padding: 90px;
height: 60px;
background:url(banner2.jpg) repeat-x;
}
#footer {
clear:both;
position:fixed;
bottom:0px;
font-size: 0.6em;
margin: 10em 0 0;
background:#F57D31;
text-align:center;
padding:0.1em;
border-top: 1px solid silver;
}
#inhalt {
position: absolute;
top: 200px;
left: 300px;
border: 0px solid #000;
}
#steuerung {
float: left;
width:200px;
padding: 20px;
background-color: #003399;
border: 1px solid black;
text-align:left; /* Textausrichtung */
color: #FF6600; /* Schriftfarbe */
font-weight: bold;
margin-top:0px; /* Abstand oben */
margin-bottom:0px; /* Abstand unten */
margin-left:0px; /* Abstand links */
margin-right:0px; /* Abstand rechts */
}
#steuerung ul {
list-style:none; /* keine Aufzählungspunkte */
color: #FF6600;
}
#steuerung li {
margin-left:5px; /* Außenabstand links */
width:120px; /* Breite des Links */
color: #FF6600;
border-top:0px black outset; /* Rahmen oben */
border-left:5px black outset; /* Rahmen links */
border-bottom:5px black outset; /* Rahmen unten */
border-right:0px black outset; /* Rahmen rechts */
margin-top:0px; /* Außenabstand oben */
padding-top:8px; /* Innenabstand */
padding-left:8px;
padding-bottom:8px;
padding-right:8px;
}
-->
</style>
Wäre super, wenn mir jemand helfen könnte!
