Manuel13: CSS-Menü / Probleme IE 6&7

Hallo zusammen,

ich habe mir ein kleines CSS-Menü geschrieben, das funktioniert auch so weit ganz gut.
Mein Problem ist, dass die komplette Seite zentriert sein muss und sobald ich die Seite zentriere werden im IE 6&7 die Untermenüpunkte nach rechts verschoben. Im Firefox/Safari/Opera wird nichts verschoben....

Es würde mich freuen, wenn mir hier jemand helfen könnte, da ich einfach nicht mehr weiter weiß.

Anbei der verkürzte Code, der den Fehler im IE zeigt. Die Untermenüpunkte werden später noch ausgeblendet und über einen :hover wieder eingeblendet, bzw im IE per JS eingeblendet.

Vielen Dank im Voraus

  
<style type="text/css">  
#seite {  
 position:absolute;  
 width:950px;  
 height:600px;  
 border:1px solid black;  
 margin-left:-475px;  
 left:50%  
}  
ul,li {  
 list-style:none;  
 margin:0;  
 padding:0;  
}  
  
#navi {  
 width:950px;  
 height:19px;  
 text-align:center;  
 background-color:#cccccc;  
}  
#menue a {  
 text-align:center;  
 display: block;  
 width: 120px;  
 height:19px;  
}  
#menue li {  
 border:1px solid #cc9999;  
 float: left;  
 padding: 0;  
 width: 120px;  
 height:19px;  
 line-height:17px;  
}  
#navi li ul {  
 position: absolute;  
 width: 120px;  
 /*left:-999em;*/  
}  
</style>  
<html>  
<body>  
<div id="seite">  
 <div id="navi">  
  <ul id="menue">  
   <li><a href="">Hauptpunkt1</a><ul>  
    <li><a href="">Unterpunkt1</a></li>  
    <li><a href="">Unterpunkt2</a></li>  
    <li><a href="">Unterpunkt3</a></li>  
    <li><a href="">Unterpunkt4</a></li>  
    <li><a href="">Unterpunkt5</a></li>  
   </ul></li>  
   <li><a href="">Hauptpunkt2</a><ul>  
    <li><a href="">Unterpunkt1</a></li>  
    <li><a href="">Unterpunkt2</a></li>  
    <li><a href="">Unterpunkt3</a></li>  
   </ul></li>  
   <li><a href="">Hauptpunkt3</a><ul>  
    <li><a href="">Unterpunkt1</a></li>  
    <li><a href="">Unterpunkt2</a></li>  
    <li><a href="">Unterpunkt3</a></li>  
    <li><a href="">Unterpunkt4</a></li>  
    <li><a href="">Unterpunkt5</a></li>  
   </ul></li>  
  </ul>  
 </div>  
</div>  
</body>  
</html>  
  

  1. Hi,

    Mein Problem ist, dass die komplette Seite zentriert sein muss
    #seite {
    position:absolute;
    width:950px;
    height:600px;
    border:1px solid black;
    margin-left:-475px;
    left:50%
    }

    ist dies der Code, mit dem Du die Zentrierung versuchst? Wenn ja, warum?

    Cheatah

    --
    X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
    X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
    X-Will-Answer-Email: No
    X-Please-Search-Archive-First: Absolutely Yes
    1. Hi,

      Mein Problem ist, dass die komplette Seite zentriert sein muss
      #seite {
      position:absolute;
      width:950px;
      height:600px;
      border:1px solid black;
      margin-left:-475px;
      left:50%
      }

      ist dies der Code, mit dem Du die Zentrierung versuchst? Wenn ja, warum?

      Cheatah

      Jup das ist meine "Zentrierung"
      wie wäre es denn anders besser???

  2. Hallo,

    validiere deine Seite, dann schau Dir nochmal die Liste an, de Du aufgebaut hast, lass erstmal die divs alle beiseite, guck auf die Liste.

    Gruß, Ich

    1. Hallo,

      validiere deine Seite, dann schau Dir nochmal die Liste an, de Du aufgebaut hast, lass erstmal die divs alle beiseite, guck auf die Liste.

      Gruß, Ich

      Sorry, sehs auch grad, vor den Hauptpunkten habe ich natürlich "<li>" statt "<ul>" stehen, aber daran lisgts nicht....

      1. Hallo,

        Sorry, sehs auch grad, vor den Hauptpunkten habe ich natürlich "<li>" statt "<ul>" stehen, aber daran lisgts nicht....

        Hast Du es mal ausprobiert? Ohne alles andere drumherum? Jetzt schau Dir doch mal float an.

        Die Liste - wolltest Du die <li> etwas versetzt innerhalb der <ul> sind oder doch direktv senkrecht zueinander (ich ging davon aus, es sollte senkrecht sein)?

        Bin erstmal beschäftigt, schaue nachher wieder rein.

        Gruß, Ich

        1. Hallo,

          Sorry, sehs auch grad, vor den Hauptpunkten habe ich natürlich "<li>" statt "<ul>" stehen, aber daran lisgts nicht....

          Hast Du es mal ausprobiert? Ohne alles andere drumherum? Jetzt schau Dir doch mal float an.

          Die Liste - wolltest Du die <li> etwas versetzt innerhalb der <ul> sind oder doch direktv senkrecht zueinander (ich ging davon aus, es sollte senkrecht sein)?

          Bin erstmal beschäftigt, schaue nachher wieder rein.

          Gruß, Ich

          Hi! Vielen Dank erstmal!
          Das mit dem Float ist so schon ok:
          also das Hauptmenü soll waagerecht sein und die untermenüpunkte direkt unter dem entsprechendem Hauptmenüpunkt senkrecht darunter.
          Dies funktioniert so auch in allen Browsern einwandfrei!

          Nur sobald ich die Ganze Seite wie oben beschrieben zentriere, dann sind die Untermenüpunkte im IE6&7 ca. 50px nach rechts verschoben....

          Evtl jemand ne Idee, was das sein kann?
          Danke schonmal an Alle!!!

          1. Hallo zusammen!
            Hat keiner eine Idee, wie ich das Problem mit den Verschobenen Untermenüpunkten im IE lösen könnte??
            Danke schonmal

            Hallo,

            Sorry, sehs auch grad, vor den Hauptpunkten habe ich natürlich "<li>" statt "<ul>" stehen, aber daran lisgts nicht....

            Hast Du es mal ausprobiert? Ohne alles andere drumherum? Jetzt schau Dir doch mal float an.

            Die Liste - wolltest Du die <li> etwas versetzt innerhalb der <ul> sind oder doch direktv senkrecht zueinander (ich ging davon aus, es sollte senkrecht sein)?

            Bin erstmal beschäftigt, schaue nachher wieder rein.

            Gruß, Ich

            Hi! Vielen Dank erstmal!
            Das mit dem Float ist so schon ok:
            also das Hauptmenü soll waagerecht sein und die untermenüpunkte direkt unter dem entsprechendem Hauptmenüpunkt senkrecht darunter.
            Dies funktioniert so auch in allen Browsern einwandfrei!

            Nur sobald ich die Ganze Seite wie oben beschrieben zentriere, dann sind die Untermenüpunkte im IE6&7 ca. 50px nach rechts verschoben....

            Evtl jemand ne Idee, was das sein kann?
            Danke schonmal an Alle!!!

            1. Hallo zusammen!
              Hat keiner eine Idee, wie ich das Problem mit den Verschobenen Untermenüpunkten im IE lösen könnte??
              Danke schonmal

              wurde oben schon gesagt, mach den html code ordentlich - mit deinem code kannst du unmöglich einen unterpunkt von einem hauptpunkt unterscheiden (ausser mit :fist-child im li - aber das geht im ie nicht):

              [code=html]
              <ul>
                <li>punkt 1
                  <ul>
                    <li>punkt 1.1</li>
                    <li>punkt 1.2</li>
                    <li>punkt 1.3</li>
                  </ul>
                </li>
                <li>punkt 2
                  <ul>
                    <li>punkt 2.1</li>
                    <li>punkt 2.2</li>
                    <li>punkt 2.3</li>
                  </ul>
                </li>
              </ul>

              [/code]

            2. Hallo,

              hattest Du jetzt überhaupt etwas verändert?

              Ich meinte, dass Du erst die Liste änderst, dann float einsetzt, ggf. ist aber display: inline wohl noch eher geeignet.

              Schau Dir mal die Beispiele an.

              Gruß, Ich