[HTML] Border nötig damit margin-top wirkt im FF - wieso?

Einklappen
X
 
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • [HTML] Border nötig damit margin-top wirkt im FF - wieso?

    Habe folgende Liste:

    PHP-Code:
    <ul style="background: #0000ff;">
        <
    li style="background: #ff9900; height: 50px; border: 1px solid #fff;">
            <
    a style="background: #ff0000; margin-top: 5px; height: 30px; display: block;" href="#">Test 1</a>
        </
    li>
        <
    li style="background: #ff9900; height: 50px;">
            <
    a style="background: #ff0000; margin-top: 5px; height: 30px; display: block;" href="#">Test 1</a>
        </
    li>
        <
    li style="background: #ff9900; height: 50px;"><a href="#">Test 1</a></li>
        <
    li style="background: #ff9900; height: 50px;"><a href="#">Test 1</a></li>
    </
    ul
    Wieso muss ich dem li einen Border geben, damit der Firefox das margin-top beim anchor annimmt? Bzw. wie kann ich das umgehen?
    Zuletzt geändert von Benny-one; 25.10.2007, 11:35.
    Sunshine CMS
    BannerAdManagement
    Borlabs - because we make IT easier
    Formulargenerator [color=red]Neu![/color]
    Herkunftsstatistik [color=red]Neu![/color]

  • #2
    wenn du aus deinem Link ein Block-Level-Element machst, sollte das margin auch ohne die Border ausgewertet werden.
    it's not a bug,
    it's a feature!

    Kommentar


    • #3
      Die Anchors sind display: block, die LIs auch.
      Sunshine CMS
      BannerAdManagement
      Borlabs - because we make IT easier
      Formulargenerator [color=red]Neu![/color]
      Herkunftsstatistik [color=red]Neu![/color]

      Kommentar


      • #4
        das mysterium hatte ich auch schon - glaube nicht mal border:0px; hat geholfen.
        Konnte bisher auch nicht nachvollziehen unter welcher bedingung eine explizite Angabe zur border nötig ist damit margin umgesetzt wird...
        it's not a bug but a feature?
        "I don't want to belong to any club that would accept me as a member."

        Groucho Marx

        Kommentar


        • #5
          Es ist W3C.... http://www.w3.org/TR/CSS21/box.html#collapsing-margins

          Wurde wohl wieder abgeschafft. Ist also mehr ein Fehler des IEs, der sich nicht dran hält.
          Workarounds und Beispiele gibt es hier http://dev.borlabs.de/gecko/gecko.htm

          Eine Browserweiche für den IE6 und IE7 ist empfehlenswert. Die IE's brauchen ein position:static, der FF ein position: absolute

          Die Browserweichen müssen aber getrennt angegeben werden:
          Beispiel
          Code:
          #mein_element {
           position: absolute;
          }
          
          /* IE 6*/
          * html #mein_element {
           position: static;
          }
          
          /* IE 7*/
          *:first-child+html #mein_element {
           position: static;
          }
          Wenn man es nicht so macht, ignoriert der IE6 das static und macht ein absolute.
          Sunshine CMS
          BannerAdManagement
          Borlabs - because we make IT easier
          Formulargenerator [color=red]Neu![/color]
          Herkunftsstatistik [color=red]Neu![/color]

          Kommentar

          Lädt...
          X