Jannsen: Darstellung im IE und Mozilla Firefox

Hallo!
Ich hab da ein Problem mit der Darstellung meiner Navigation in den veschiedenen Browsern. Irgendwie schneidet Mozilla Firefox etwas von meinem Navigations-Container auf der rechten Seite ab. Im IE ist der Navigatioons-Container größer als im Firefox, und so will ich es auch eigentlich von der Größe her haben. Kann mir jemand vielleicht sagen, wie ich verhindern kann, dass Firefox mir was vom Container abschneidet? Der aktive Menüpunkt (im Beispiel "Startseite") hat die gewünschte Breite.

Hier erstmal der Quelltext:

---------------------------------------------------------------

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
  "http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
<title>Nav</title>
<style type="text/css"><!--

#hauptnavigation {
width:11em;
background-color: #3a6ea5;
border: 1px solid #A9B0D7;
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #2E3192;
font-size:0.7em;
}

#hauptnavigation ul, #hauptnavigation ul li {
padding: 0px;
margin: 0px;
list-style: none;
}

#hauptnavigation a {
text-decoration: none;
display: block;
color: #FFFFFF;
border-left:5px solid #FFF;
border-color:#3a6ea5;
padding-right:3px;
}

#hauptnavigation a:hover {
text-decoration: none;
display: block;
background-color:#FFFFFF;
color:#3a6ea5;
border-left: 5px solid #FFF;
border-color:#3a6ea5;
padding:6px 7px;
}
#hauptnavigation a:active {
text-decoration: none;
display: block;
background-color:#FFFFFF;
color:#000000;
border-left: 5px solid #000;
}

* html #hauptnavigation a {
width: 100%;
}

#hauptnavigation ul li {
font-weight: bold;
border-bottom: 1px solid #FFFFFF;
}

* html #hauptnavigation ul li {
height: 1em;
}

#hauptnavigation ul li a {
padding: 6px;
}

/*Klasse unsichtbar für den Anker zum Überspringen der Navigation*/
.unsichtbar {
position: absolute;
left: -1000px;
top: -1000px;
width: 0px;
height: 0px;
overflow:hidden;
display:inline;
}

/*Unterpunkte*/
#hauptnavigation ul li ul li a {
padding: 6px;
padding-left:7px;
}

#hauptnavigation ul li ul li {
font-weight: normal;
border-top: 1px solid #A9B0D7;
border-bottom: 0 solid #A9B0D7;
}

/*Ausgewählter Menüpunkt*/
.selected {
width:100%;
color:#000000;
text-decoration: none;
background-color:#FFFFFF;
border-left: 5px solid #000;
padding:6px 7px;
}

//--></style>
</head>
<body style="background-color:#0000FF;">

<div id="hauptnavigation">
<p class="unsichtbar"><a href="#zielAnker">Navigation überspringen</a></p>
<strong class="unsichtbar">Hauptnavigation</strong>
<ul>
<li><div class="selected">Startseite</div></li>
<li><a href="aktuelles.html">Aktuelles</a></li>
<li><a href="team.html">Wir über uns</a>
<ul>
<li><a href="team2.html">Das Team der Bücherei</a></li>
<li><a href="team3.html">Kontakt</a></li>
</ul>
</li>
<li><a href="medienbestand.html">Medienbestand</a></li>
<li><a href="service.html">Serviceleistungen</a></li>
<li><a href="veranstaltungen.html">Veranstaltungen</a></li>
<li><a href="kinder.html">Für Kinder</a></li>
<li><a href="benutzung.html">Benutzung</a></li>
<li><a href="impressum.html">Impressum</a></li>
</ul>
<a name="zielAnker" class="unsichtbar"></a>
</div>

</body>
</html>

----------------------------------------------------------------

Vielleict könnt ihr euch die Seite ja mal im IE und im Firefox anschauen.

Hoffe ihr könnt mir helfen. Danke im Voraus.

MfG, Jannsen

  1. Hi,

    Vielleict könnt ihr euch die Seite ja mal im IE und im Firefox anschauen.

    Welche Seite?

    freundliche Grüße
    Ingo

    1. hier der Link:
      http://www.stadtbuecherei-niebuell.de/test/navigation.html

      Hi,

      Vielleict könnt ihr euch die Seite ja mal im IE und im Firefox anschauen.
      Welche Seite?

      freundliche Grüße
      Ingo

      1. Hi Jannsen,

        hier der Link:
        http://www.stadtbuecherei-niebuell.de/test/navigation.html

        Wo ist da ein Link?

        Hier ist einer: http://www.stadtbuecherei-niebuell.de/test/navigation.html

        Hier noch einer: </faq/#Q-19>
        Gruß,
        Gunnar

        --
        “I got my finger on the trigger / But I don’t know who to trust” (Bruce Springsteen, Devils and Dust)
      2. Hi,

        http://www.stadtbuecherei-niebuell.de/test/navigation.html

        Der Fehler liegt darin,
        /*Ausgew�hlter Men�punkt*/
        .selected {
        width:100%;
        }
        für standardkonforme Bowser anzugeben. Und außerdem ist ein Menüpunkt zu lang bzw. die Liste hierfür zu schmal.

        freundliche Grüße
        Ingo

        1. Der Fehler liegt darin,
          /*Ausgew�hlter Men�punkt*/
          .selected {
          width:100%;
          }
          für standardkonforme Bowser anzugeben. Und außerdem ist ein Menüpunkt zu lang bzw. die Liste hierfür zu schmal.

          Wenn ich "width:100%" wegnehme, dann wird der aktuelle Listenpunkt aber leider im IE nicht vollständig weiß gefärbt. Weißt du, wie ich das vielleicht hinbekomme? Im Firefox sieht es ohne "width:100%" zwar super aus, jedoch ist der Container immer noch schmaler als im IE.
          Danke aber für deine schnelle Antwort.

          1. hi,

            Wenn ich "width:100%" wegnehme, dann wird der aktuelle Listenpunkt aber leider im IE nicht vollständig weiß gefärbt.

            deshalb sagte Ingo ja auch, dass es ein fehler ist, das für _standardkonforme_ browser anzugeben.

            Weißt du, wie ich das vielleicht hinbekomme?

            in dem du dafür sorgst, dass nur der IE diese formatierung interpretiert, per conditional comments oder per CSS hack (der "star html hack" würde sich bspw. anbieten).

            gruß,
            wahsaga

            --
            /voodoo.css:
            #GeorgeWBush { position:absolute; bottom:-6ft; }
            1. in dem du dafür sorgst, dass nur der IE diese formatierung interpretiert, per conditional comments oder per CSS hack (der "star html hack" würde sich bspw. anbieten).

              Ok, ich probier´s mal aus. Danke für die Antworten.

  2. Moinsen,

    Hallo!
    Ich hab da ein Problem mit der Darstellung meiner Navigation in den veschiedenen Browsern. Irgendwie schneidet Mozilla Firefox etwas von meinem Navigations-Container auf der rechten Seite ab.

    ich vermute eine fehlende Definition von padding und margin als Ursache. Somit macht jeder Browser was an Voreinstellungen da ist, und duie sind nicht überall gleich.

    --
    cu,
    Maz