Stefan: padding+hover+IE = Probleme?!

Hi,

ich brauche eure Hilfe ;)

Ich habe mein JavaScript-Menü mit CSS fast komplett fertig. Ich habe auch das Problem mit dem teil-transparenten Hintergrund dank dem Forum hier schon gelöst. Doch jetzt sitze ich schon vor dem nächsten Problem. Ich habe das Menü mit Listen und CSS gelöst. Nur hier gibt es ein Problem mit dem IE. Ich möchte mit padding einen Abstand zwischen den Einträgen machen, welcher aber auch zu dem Link gehören soll. Im Firefox geht es klarerweise ;P, im IE nicht :/. Der nimmt einfach nur den Text als Link an. Ich habe natürlich schon in vielen Foren gesurft und es gibt auch einige mit diesem Problem, aber nirgends habe ich eine funktionierende Lösung gefunden.

Könnt ihr mir vl. Tips dazu geben?

thx
Stefan

  1. hi,

    Ich habe das Menü mit Listen und CSS gelöst. Nur hier gibt es ein Problem mit dem IE. Ich möchte mit padding einen Abstand zwischen den Einträgen machen, welcher aber auch zu dem Link gehören soll. Im Firefox geht es klarerweise ;P, im IE nicht :/. Der nimmt einfach nur den Text als Link an.

    kommt natürlich darauf an, wie du dein menü aufgebaut hast ...

    der IE braucht, beim "gängigen" vorgehen zum aufbau eines listenmenüs - <li> mit fester breite, untereinander oder gefloatet, links darin mit display:block - idR. noch zusätzlich width:100% für den link.

    gruß,
    wahsaga

    --
    /voodoo.css:
    #GeorgeWBush { position:absolute; bottom:-6ft; }
    1. Hi!

      kommt natürlich darauf an, wie du dein menü aufgebaut hast ...

      der IE braucht, beim "gängigen" vorgehen zum aufbau eines listenmenüs - <li> mit fester breite, untereinander oder gefloatet, links darin mit display:block - idR. noch zusätzlich width:100% für den link.

      Naja, so habe ich es bis jetzt auch gehabt nur funkt auch nicht...

      .submenus{
      display: none;
      width: 150px;
      position: absolute;
      top: 11pt;
      }

      .submenus li{
      width: 100%;
      }

      .submenus li a{
      padding: 4px 8px 4px 8px;
      /*height:1.2em;*/
      display: block;
      width: 100%;
      }

      Und eben dieses padding beim Link funktioniert nicht - der IE nimmt diesen Bereich nicht als Link an...

      ABER:
      Und das ist wirklicht lustig :P
      Von allen Submenüs (unterhalb wäre ein Beispiel) tritt dieses Problem immer nur beim 1. Eintrag (hier "Sub 1") auf. Und aus diesem Verhalten werde ich ganz und gar nicht gescheit :/. Bei allen anderen Einträgen wird der ganze Block als Link angenommen.

      • Aber nur beim IE treten diese Probleme auf

      <ul class="submenus">
      <li class="menulinkout"><a href="">Sub 1</a></li>
      <li class="menulinkout"><a href="">Sub 2</a></li>
      <li class="menulinkout"><a href="">Sub 3</a></li>
      <li class="menulinkout"><a href="">Sub 4</a></li>
      </ul>

      So schaut ein Teil ca aus. Es ist schwer, weil ich nicht weiß was ich jetzt alles hier posten soll weil alles ist zu viel und ob du damit etwas anfangen kannst... ;)

      thx
      Stefan