nicht angemeldet
Navigation mit CCS ist im IE6 nicht zentriert
Hallo Leute,
ich bin zwar mit CSS vertraut, habe aber noch nie eine Webseite komplett im CSS aufgebaut, was ich jetzt gerade versuche.
Die Seite soll flexibel sein und sich von der Breite her an die Auflösung des Users anpassen.
Mein Problem ist, dass die Navigation im Firefox zentriert angezeigt wird und im IE6 grob auch, aber da kommen rechts immer ein paar Pixel dazu.
Kann mir jemand helfen. (Die Farben bitte nicht beachten, dient nur der Auseinanderhaltung von einzelnen Elementen.)
Hier ist der Quellcode:
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Unbenanntes Dokument</title>
<style type="text/css">
/*Definition für 100% Höhe*/
html,body {
spacing:0;
height:100%;
font-family:Arial, Helvetica, sans-serif;
font-size: 100.01%;
font-weight:normal;
}
*{
margin: 0px;
padding: 0px;
}
/* Außenrahmen für gesamten Inhalt */
#container {
margin:0;
width:100%;
height:100%;
background-color:#cecece;
}
/* Container für eigentliche Seite */
#maincontainer {
margin: 0 auto;
width:80%;
height:100%;
background-color:#ffffff;
}
/*Logo-Schriftzug*/
#logo {
padding-top:1%;
padding-left:1.9%;
width:48%;
font-size:2.4em;
font-weight:bold;
float:left;
}
#logo .blue {
color:#216eba;
}
#logo .green {
color:#3cb52e;
}
/*Top-Navigation (Textlinks(*/
#topnav {
padding-right:2.1%;
padding-top:1%;
width:35%;
line-height:2em;
vertical-align:middle;
font-size:0.8em;
color:#216eba;
font-weight:bold;
text-align:right;
float:right;
}
#topnav a:link, #topnav a:active, #topnav a:visited{
font-size:0.9em;
color:#216eba;
font-weight:bold;
text-decoration:none;
}
#topnav a:hover {
font-size:0.9em;
color:#3cb52e;
font-weight:bold;
text-decoration:none;
}
/*Main Navigation - Navigationsleiste*/
#mainnavbar {
clear:both;
width:96%;
margin:auto;
background-color:#216eba;
}
#mainnavbar ul{
background-color:#FF0000;
display:block;
width:80%;
margin:0 auto;
text-align:center;
}
#mainnavbar li{
background-color: #99FF33;
display:inline;
padding:1%;
color:#ffffff;
font-weight:bold;
font-size:0.8em;
}
#mainnavbar .li{
background-color: #99FF33;
display:inline;
color:#ffffff;
padding-left:1%;
font-weight:bold;
font-size:0.8em;
}
</style>
</head>
<body>
<div id="container">
<div id="maincontainer">
<div id="logo">
<span class="blue">Einmalige-Geschenke</span><span class="green">.de</span>
</div>
<div id="topnav">
<a href="#">»Hilfe</a> <a href="a">»FAQs</a> <a href="#">»AGB</a> <a href="#">»Kontakt</a> <a href="#">»Impressum</a>
</div>
<br />
<br />
<br />
<br />
<div id="mainnavbar">
<ul>
<li>Startseite</li>
<li>Neue Geschenke</li>
<li>Geschenke Highlights</li>
<li>Anlässe</li>
<li >Alle Geschenkideen</li>
<li class="li">Warenkorb</li>
</ul>
</div>
</div>
</div>
</body>
</html>
-
Hallo!
Mein Problem ist, dass die Navigation im Firefox zentriert angezeigt wird und im IE6 grob auch, aber da kommen rechts immer ein paar Pixel dazu.
Ich kann keinen Unterschied erkennen. Ich sehe zwar einen großen Unterschied, was den Rest angeht, aber die Navigation ist bei mir in beiden Browser eigentlich perfekt zentriert. Wie viel Pixel sind bei dir ein paar?
ciao, ww
--
sh:( fo:| ch:~ rl:( br:> n4:~ ie:% mo:) va:) de:] zu:) fl:( ss:| ls:~ js:)-
wenn ich die Seite im IE6 anschaue, sieht es bei mir so aus:
Blau ist im Weiß zentriert, Rot ist im Blau zentriert und Grün ist zwar im Rot zentriert, aber um 12-20 Px nach links versetzt. Das Versetzen ändert sich beim verkleinern/vergrößern des Fensters.
Danke für die Mühe
-
-
Hallo jackysu
Hier ist der Quellcode:
...
Wenn es dir irgendwie möglich ist, solltest du uns einen Link zu einer Beispielseite posten, statt den Quelltext.
Dieser Link wäre schnell angeklickt, auch in mehreren Browsern. Wenn ich das dann intensiver testen will, ist die Seite dann schneller lokal gespeichert, als mittels C&P in eine eigenen Testseite eingefügt.
Bei einem geposteten Quelltext schaue ich meist nur schnell drüber, ob irgendetwas daran auffällig ist, und wenn mir nichts auffällt, kümmere ich mich nicht weiter drum.Auf Wiederlesen
Detlef--
- Wissen ist gut
- Können ist besser
- aber das Beste und Interessanteste ist der Weg dahin!