nicht angemeldet
Problem mit einem 10px Abstand.
Hallo Forumsgemeinde,
ich ändere gerade eine Liste, die bisher keine war (<p> mit vielen <br> darin). Alte Seite.
So sieht es jetzt mit einer Liste aus: Neue Seite. Allerdings rutscht die erste Jahreszahl um 10px nach unten, und ich finde nicht heraus weshalb dies so ist. (wahrscheinlich sehe ich den Wald vor lauter Bäumen nicht.
Wenn das erste <dt> ein margin-top von 0px bekommt sieht es richtig aus: Neue Seite mit dt 0px.
Wo kommen nur diese 10px her?
Danke für jeden Tip.
Tommy
-
Hi!
Allerdings rutscht die erste Jahreszahl um 10px nach unten, und ich finde nicht heraus weshalb dies so ist. (wahrscheinlich sehe ich den Wald vor lauter Bäumen nicht.
Oder du nimmst keine geeigneten Werkzeuge. Firebug für den Firefox oder die Debugbar für den IE zeigen dir viele Informationen über die Formatierung einzelner Elemente an.
Lo!
-
Oder du nimmst keine geeigneten Werkzeuge. Firebug für den Firefox
Hallo,
ich habe mir gerade den Firebug installiert, jetzt sehe ich den Unterschied schön farblich hinterlegt, weis aber trotz alledem nicht wieso.
Tommy
-
Hi!
Oder du nimmst keine geeigneten Werkzeuge. Firebug für den Firefox
ich habe mir gerade den Firebug installiert, jetzt sehe ich den Unterschied schön farblich hinterlegt, weis aber trotz alledem nicht wieso.Unter "HTML" hast du vermutlich schon das Element gewählt. Rechts unter "Layout" siehst du alle Abstände in graphisch, unter "Berechnet" alle CSS-Eigenschaften als Text und bei "Styles" siehst du, was in welcher Reihenfolge wirkt. Du kannst da auch live Änderungen vornehmen.
Lo!
-
...und bei "Styles" siehst du, was in welcher Reihenfolge wirkt
Hallo,
ich finde immer noch nicht weshalb in der ersten Zeile <dt> und <ul> nicht auf der gleichen Höhe stehen. Habe mit dem Firebug alle margin von p auf 0 gesetzt, das erste dt steht 10 px tiefer. Ich kann auch die Jahre 2010 und 2009 löschen, dann tritt der effekt bei 2008 auf.
Tommy
-
Hi!
...und bei "Styles" siehst du, was in welcher Reihenfolge wirkt
ich finde immer noch nicht weshalb in der ersten Zeile <dt> und <ul> nicht auf der gleichen Höhe stehen.Das ist etwas schwieriger, weil dazu Wissen notwendig ist. Collapsing Margins nennt sich das Prinzip, nach dem Abstände "einfach zusammenfallen".
Das dl#gw-treffen hat einen margin-top von 18px (Default-Browser-Stylesheet). Alle dl#gw-treffen dd ul haben einen margin-top von 10px. Dise beiden fallen zusammen. Alle dl#gw-treffen dt haben ebenfalls einen margin-top von 10px, aber auch float:left, womit sie aus dem Elementefluss sind und die Collapsing Margins nicht greifen. Alle nachfolgenden ul-Elemente kollabieren nicht mehr mit irgendwas vorhergehendem, weswegen ihr 10px und das dt-10px in gleicher Höhe sind.
Lo!
-
Das ist etwas schwieriger, weil dazu Wissen notwendig ist.
Hallo,
wieder dazugelernt. margin-top weg, dt und dd erhalten 10px padding-top und alles ist schön: Finale Seite.
Danke
Tommy
-
-
-
-
-