nicht angemeldet
Padding wird unterschiedlich IE / Firefox
Hallo Wissende,
wenn Ihr dem Link hier folgt, sehr Ihr 3 CSS-Buttons. Im IE wird alle schön angezeigt, aber im Firefox wird, scheinbar durch den Padding-Befehl der Bereich grösser dargestellt als erwünscht.
Wie kann ich das abstellen oder so verbessern, dass es in beiden Browser richtig dargestellt wird und nicht so Fehlerhaft ausschaut?
Es muss am Padding liegen, denn wenn ich Padding aus dem Code entferne, gibt es diese Problematik nicht, aber dafür wird der Text innerhalb des Buttons top-ausgerichtet und nicht mittig, wie ich es gern hätte.
Wer kann helfen?
http://css-maker.de/scripts/csstest/button.html
Danke Tom
-
Hallo Tom,
Im IE wird alle schön angezeigt,
<http://de.selfhtml.org/css/formate/box_modell.htm#box_model_bug@title=Der Box-Modell-Fehler des Internet Explorers>
aber im Firefox wird, scheinbar durch den Padding-Befehl der Bereich grösser dargestellt als erwünscht.
<http://de.selfhtml.org/css/formate/box_modell.htm#w3c@title=CSS1: Berechnung von Breite und Höhe>
Wie kann ich das abstellen oder so verbessern, dass es in beiden Browser richtig dargestellt wird und nicht so Fehlerhaft ausschaut?
<http://de.selfhtml.org/css/formate/box_modell.htm#standardkonform@title=Dokumenttyp-Deklarationen für den standardkonformen Modus>
Grüße
Roland-
Hallo Roland,
ich habe mir das alles mal angeschaut und gelesen. Teilweise habe ich auch verstanden. Nur was soll ich jetzt machen?
Ich kann doch nicht um jeden Button-Link einen DIV-Container ballern. Ist das nicht zu viel des Guten? Oder ist es tatsächlich die einzige Lösung?
Ich könnte auch alles so lassen und einfach das Padding verwerfen. Das hat den Nachteil, dass der Text innerhalb des Buttons oben gezeichnet wird und nicht mittig. Kann ich das nur mittels Padding realisieren? vertical-align scheint da nicht zu funzen.
Das kann doch nicht sooo schwer sein. Wahrscheinlich habe ich nen grossen Denkfehler, weil es mal ausnahmsweise im IE gut ausschaut, aber ebe nicht im Firefox, obwohl es da richtig gerendert wird...!?
Tom
-
Hi,
ich habe mir das alles mal angeschaut und gelesen. Teilweise habe ich auch verstanden. Nur was soll ich jetzt machen?
Was spricht denn dagegen, den IE in den standardkonforme(re)n Modus zu versetzen?
freundliche Grüße
Ingo-
Hallo Ingo,
Was spricht denn dagegen, den IE in den standardkonforme(re)n Modus zu versetzen?
Nix, nur welchen soll ich nehmen? Und wenn ich das dann getan habe, sieht es auch im IE schlecht aus. Wie kann ich also dann das Problem mit dem Padding lösen?
-
Nix, nur welchen soll ich nehmen? Und wenn ich das dann getan habe, sieht es auch im IE schlecht aus. Wie kann ich also dann das Problem mit dem Padding lösen?
Eben drum. Der Firefox und der IE im standardkonformane Modus machen es nämlich richtig. Versetze also den IE in den standardkonformaen Modus, sodass die Seite in beiden (allen) Browsern gleich dargestellt wird und verkleinere dann z.B. die width/height-Angabe, je nachdem was du erreichen willst.
-
Hallo Ingo,
Was spricht denn dagegen, den IE in den standardkonforme(re)n Modus zu versetzen?
Nix, nur welchen soll ich nehmen? Und wenn ich das dann getan habe, sieht es auch im IE schlecht aus. Wie kann ich also dann das Problem mit dem Padding lösen?
Daran denken dass width/height + margin + padding = gesamtgröße ist.
Also von Deiner ursprünlichen (im IE, im falschen Modus, passenden) Größe das padding abziehen.
Bsp:
Vorher passte höhe 10px im IE im Quirks-Modus, bei padding 5px.
Jetzt nimmt Du also? Richtig height:5px bei einem padding von 5px.
-
Danke, ich habs endlich VOLLSTÄNDIG kapiert!!!
-
-
-
-
-