Maximilian Baumgart: IE-CSS-Probleme mit Abständen

Hallo,

ich gestalte grad die Seiten unsrer lokalen Greenpeacegruppe neu und habe Probleme damit, den IE dazu zu bewegen, die Seiten so darzustellen, wie ich es mir gedacht und auch im CSS definiert habe (Mozilla und Opera tuin dies hingegen weitgehend).

Konkret sind dies:

Wie bekomme ich den viel zu hohen vertikalen Abstand zwischen den (Bilder)links im Linkbalken rechts auf der Startseite und beim Regeneradio weg?

Wie werde ich die unschönen Abstände über und unter den <hr>-Elementen los (insbesondere unter der Navigation und über der Fußleiste sowie in der Linkleiste)?

Und wie schaffe ich es, dass der Hauptinhalt der Seite im IE auf der Startseite und der Regeneradioseite nicht unter den Linkbalken ge»clear«t wird? Dank zoom:1 tut der IE es auf der Startseite schon (benso wie Motilla und Opera dank overflow: hidden), aber bei mancher IE-6-Version auf der Regeneradio-Seite nicht. Das clear:both bei der h2 hab ich schon entfernt, dennoch wird der gesamte Inhalt auch vor der h3, die dann wieder clear:both hat, unter den Linkbalken geschoben. Könnt ihr das bestätigen? Und wisst ihr Rat?

Zu guter Letzt: Wie bringe ich den IE dazu, im Gästebuch die Abstände zwischen der div des Eintrags/Kommentars und der h3 des nächsten Eintrages richtig darzustellen? Momentan zeigt der IE den border/Rahmen der div(s) ohne Lücke nahtlos bis zum Beginn der nächsten h3 an, egal wie groß ich den margin wähle (der auch jetzt schon größe null gestellt ist), so, als sei der Rahmen um den margin/Rand herum zu zeichnen und nicht um das padding/den Innenabstand.

Ich freue mich auf eure Ratschläge :).

Max.

  1. Hallo,

    Wie bekomme ich den viel zu hohen vertikalen Abstand zwischen den (Bilder)links im Linkbalken rechts auf der Startseite und beim Regeneradio weg?

    mit den entsprechenden margin-Attributen.

    Wie werde ich die unschönen Abstände über und unter den <hr>-Elementen los (insbesondere unter der Navigation und über der Fußleiste sowie in der Linkleiste)?

    mit den entsprechenden margin-Attributen.

    Zu guter Letzt: Wie bringe ich den IE dazu, im Gästebuch die Abstände zwischen der div des Eintrags/Kommentars und der h3 des nächsten Eintrages richtig darzustellen? Momentan zeigt der IE den border/Rahmen der div(s) ohne Lücke nahtlos bis zum Beginn der nächsten h3 an, egal wie groß ich den margin wähle (der auch jetzt schon größe null gestellt ist), so, als sei der Rahmen um den margin/Rand herum zu zeichnen und nicht um das padding/den Innenabstand.

    Beschäftige dich bitte grundlegend mit der Eigenschaft margin.

    Gruß aus MeckPomm

    --

    'Glauben kann keine Berge versetzen, aber der Glaube vermag Berge dahin zu stellen, wo noch keine Berge sind.'
    Friedrich Nietzsche
    1. Hallo,

      das habe ich bereits :). Und ich habe die entsprechenden margin-Attribute auch überall gesetzt, wie du dich selbst überzeugen kannst. Zum Beispiel den vertikalen bei den erwähnten horizontalen Linien auf null und zwischen den Links auf einen kleinen Wert. Im Opera und im Mozilla wird das auch richtig umgesetzt. Nur der Internet Explorer setzt die margins aus irgendeinem Grunde nicht um bzw. verlängert an einer Stelle den Rahmen bis in den margin hinein.

      Bitte schaut euch die CSS-Datei an, da könnt ihr die margins nachlesen. Oder ich schreib hier der Übersicht halber bei nächster Gelegenheit am besten nochmal die einzelnen betreffenden Abschnitte rein; sonst ist es für einen Außensethenden vielleicht wirklich schwer, sich reinzufinden. Hier zur Verdeutlichung erstmal die für die <hr>s:

      div#kopfleiste hr, div#linkbalken hr, div#unternavi hr, div#fuss hr {  
       margin: 0 !important;  
      }  
      
      

      sowie

      hr {  
       height: 0;  
       padding: 0;  
       line-height: 0;  
       clear: both !important;  
      }
      

      Max.

  2. hi,

    Wie bekomme ich den viel zu hohen vertikalen Abstand zwischen den (Bilder)links im Linkbalken rechts auf der Startseite und beim Regeneradio weg?

    Hast du margin und padding für UL und LI angegeben?
    Falls das im IE auch noch nichts hilft, dann wie üblich - den von ihm fehlinterpretierten Whitespace zwischen den Tags entfernen.

    Wie werde ich die unschönen Abstände über und unter den <hr>-Elementen los (insbesondere unter der Navigation und über der Fußleiste sowie in der Linkleiste)?

    Müssen es HR sein - tun's nicht auch entsprechende Borders?

    gruß,
    wahsaga

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

      Hast du margin und padding für UL und LI angegeben?
      Falls das im IE auch noch nichts hilft, dann wie üblich - den von ihm fehlinterpretierten Whitespace zwischen den Tags entfernen.

      Danke, das wars :). Die Zeilenumbrüche zwischen den li-Elementen auszukommentieren hat den IE endlich überzeugen können :). Schön, wenigstens diesen Makel beseitigen zu können :).

      Müssen es HR sein - tun's nicht auch entsprechende Borders?

      Die hr-Elemente trennen allgemein Seitenbereiche  – Kopf, Inhalt und Fuß – oder -unterbereiche – die Einleitung von den Neuigkeiten, die einzelnen Links zu einer Regeneradio-Sendung – voneinander. Und wenn ich da Trennlinien haben will, kann ich auch gleich ne <hr> nehmen, die ist zudem dann auch in Textbrowsern da. Ich seh das einfach mal als das zukünftige seperator-Element :D.

      Max.