Hallo erstmal,
hab schon sehr viel im Forum gelesen und es hat mir sehr geholfen, dafür erstmal danke.
Jetzt aber zu meinem Problem:
Ich habe eine Website erstellt, bei der ganz oben ein Menü vorhanden ist. Dies habe ich mit CSS formatiert und war froh, dass alles so funktioniert, wie ich wollte. Allerdings nur mit dem IE und nicht mit dem Mozilla.
Im IE sieht das ganze so aus:
http://www.web488.server-drome.net/ie.jpg
Mit dem Mozilla so:
http://www.web488.server-drome.net/moz.jpg
Natürlich möchte ich, dass es so wie beim IE aussieht.
Hier ist der Quelltext:
...
</head>
<body>
<div id="rahmen">
<div id="head">
<div id="nav-header">
<ul class="nav1st">
<li class="active"><a class="current" href="index.php?article_id=1 ">Home</a></li>
<li><a href="index.php?article_id=4">Basketball</a></li>
<!-- weiter Listenelemente -->
</ul>
</div>
</div><!-- end head -->
<!-- start content -->
...
Meine CSS-Datei sieht wie folgt aus:
@charset "utf-8";
/* CSS Document */
body {
margin-top: 5px;
margin-bottom: 5px;
background-color : #d4d4d4;
}
#rahmen {
position : relative;
display : block;
margin: 0px auto;
padding: 0px;
width: 950px;
background-color: #4879C2;
text-align : left;
border : 1px solid #000099;
}
#head {
position : relative;
clear : left;
margin: 0px;
padding: 0px;
width: 950px;
height: 100px;
background-color: #FFFF00;
}
ul,ol {list-style:none }
ul {list-style: none;}
ul li {margin: 0;}
ul li ul {margin: 0; list-style: none;}
ul li ol {margin: 0;}
#nav-header {
font-family: arial;
font-size: 12px;
position : relative;
/*left: 0px;*/
float : left;
height : 21px;
width : 950px;
display : block;
border-spacing : 0px;
margin : 0px;
padding : 0px;
background-image : url('top_menu_bg.jpg');
background-repeat : repeat-x;
}
#nav-header ul.nav1st li {
float : left;
height : 21px;
}
#nav-header ul.nav1st a, #nav-header ul.nav1st a:link, #nav-header ul.nav1st a:visited {
display : block;
line-height : 21px;
margin-right : 2px;
padding-left : 5px;
padding-right : 5px;
/*margin-top: 0px;*/
color : #ffffff;
font-size : 12px;
}
#nav-header ul.nav1st a:hover, #nav-header ul.nav1st li.active a, #nav-header ul.nav1st li.active a:link {
text-decoration : none;
background-image : url ('top_menu_hover2.jpg');
}
Da ich schon sehr viel rumprobiert habe, weiß ich gar nicht mehr, was bei der CSS-Datei dringend benötigt wird. Kann also sein, dass viele unwichtige Dinge dabei sind.
Die Baustelle könnt ihr hier betrachten:
Baustelle
Wäre cool, wenn mir jemand helfen kann. Bevor dieses Problem nicht gelöst ist, will ich eigentlich nicht weiter machen.
MfG Sebastian