Andreas Korthaus: margin-Problem im IE

Hallo!

Ich habe ein fertiges Tabellen-Design (leider...), und möchte jetzt in der Tabelle ein div für Fehlermeldungen ausgeben, das aber zentriert und mit einem Abstand von ca. 10% zum Rand angezeigt werden soll. Das war auch mit Mozilla/Firefox kein Problem, aber der IE kümmert sich in diesem Fall nicht um die margin-Angabe: Demo

Kann mir jemand sagen wieso und was ich dagegen machen kann? Wie gesagt, die Tabellen drum herum sind leider gegeben, wenn ich daran was verändere, hat das Auswirkungen auf sehr viele Templates.

Viele Grüße
Andreas

--
SELFHTML Tipps & Tricks: http://aktuell.de.selfhtml.org/tippstricks/
  1. Hallo Andreas,

    Ich habe ein fertiges Tabellen-Design (leider...), und möchte jetzt in der Tabelle ein div für Fehlermeldungen ausgeben, das aber zentriert und mit einem Abstand von ca. 10% zum Rand angezeigt werden soll. Das war auch mit Mozilla/Firefox kein Problem, aber der IE kümmert sich in diesem Fall nicht um die margin-Angabe: Demo

    Ich wäre eigentlich nur mit der Darstellung in Opera zufrieden, denn auch in Firefox/Mozilla hat der Grüne Bereich oben und unten sonst nicht die gleiche Höhe.

    Kann mir jemand sagen wieso und was ich dagegen machen kann? Wie gesagt, die Tabellen drum herum sind leider gegeben, wenn ich daran was verändere, hat das Auswirkungen auf sehr viele Templates.

    Ich vermute, dass du auch auf den Doctype keinen Einfluss hast und auch nicht auf die Formatierungen des Tabellenlayouts? Da sehe ich ganz schwarz. Da bleibt dir eigentlich deinerseits nur, zum Ausgleich noch eine Tabelle in die Tabelle in der Tabelle einzufügen; diese dann notfalls mit table-layout:fixed. Oder du schreibst ein Javascript, dass die Formatierungen der Elternelemente ändert. Ne, was für ein Murks, diese Templates mit denen du da arbeiten musst!

    Gruß Gernot

    1. Hallo!

      Kann mir jemand sagen wieso und was ich dagegen machen kann? Wie gesagt, die Tabellen drum herum sind leider gegeben, wenn ich daran was verändere, hat das Auswirkungen auf sehr viele Templates.

      Ich vermute, dass du auch auf den Doctype keinen Einfluss hast

      Einfluss habe ich schon, die Frage ist nur, ob es sich lohnt wenn dabei zu viele andere Sachen "kaputt gehen" die ich dann alle wieder reparieren muss. Allerdings hätte ich beim Doctype eigentlich keine Bedenken - nur bringt mir das ja höchstens was für IE6, oder? Damit wäre ich auch nicht viel weiter - wichtigster Referenz-Browser ist IE5.

      und auch nicht auf die Formatierungen des Tabellenlayouts?

      Naja, kommt drauf an was ich ändere. Wenn ich etwas ändere was sich nicht auf andere Templates auswirkt - oder sich wenigstens in wenigen Stunden beheben lässt, dann kann ich es vergessen. Allerdings weiß ich nicht wirklich was da konkret nötig wäre. Komischereise funktioniert das ganze ja, wenn ich die äußere Tabelle entferne. Aber solange diese Tabelle da ist (auch ohne jegliche Formatierungen), geht das innere Div immer über 100%: Demo mit nur einer Tabelle

      Ich verstehe es ehrlich gesagt überhaupt nicht...

      Da sehe ich ganz schwarz. Da bleibt dir eigentlich deinerseits nur, zum Ausgleich noch eine Tabelle in die Tabelle in der Tabelle einzufügen;

      schön gesagt ;-)

      Naja, das ist der letzte Ausweg, ich hatte gehofft das vermeiden zu können. Ich würde gerne wissen was ich an den Tabellen ändern muss, damit ich darin mit divs... arbeiten kann (ich weiß dass das nicht ideal ist), aber ich würde es gerne vermeiden weiter Templates mit mehrfach verschachtelten Tabellen zu schreiben. Die beiden äußeren Tabellen stehen nicht in den jeweiligen Templates, das sind nur "header" und "footer" Templates. In den eigentlichen Templates könnte ich direkt mit divs arbeiten, und später mal header und footer anpassen.

      diese dann notfalls mit table-layout:fixed. Oder du schreibst ein Javascript, dass die Formatierungen der Elternelemente ändert.

      Was bräuchte ich denn da für eine Formatierung? (ohne JS)

      Ne, was für ein Murks, diese Templates mit denen du da arbeiten musst!

      jepp :-(

      Grüße
      Andreas

      --
      SELFHTML Feature Artikel: http://aktuell.de.selfhtml.org/artikel/
      1. Hallo Andreas,

        also der Doctype scheint nach meinen Experimenten doch egal zu sein, eine zusätzliche Tabelle brauchst du auch nicht, wenn du die dem DIV-Element direkt übergeordnete Zelle anpassen kannst:

        Was bräuchte ich denn da für eine Formatierung?

        Dieser Tabellenzelle müsstest du align="center" oder text-align:center; verpassen und gleichzeitig deinem DIV der Klasse "errors" width:90%;

        Gruß Gernot

        1. Hallo nochmal

          Dieser Tabellenzelle müsstest du align="center" oder text-align:center; verpassen und gleichzeitig deinem DIV der Klasse "errors" width:90%;

          Letzteres solltest du den anderen Browsern nicht geben, und natürlich muss es 80% heißen, da du ja rechts und links 10% Abstand haben möchtest, also z.B.:

            
                  * html div.errors {  
                    width:80%;  
                  }  
          
          

          Gruß Gernot

        2. Hallo Gernot!

          Was bräuchte ich denn da für eine Formatierung?

          Dieser Tabellenzelle müsstest du align="center" oder text-align:center; verpassen und gleichzeitig deinem DIV der Klasse "errors" width:90%;

          Das kann ich leider nicht machen, weil das zu viele andere Templates verändert. Ich habe es jetzt an Stelle des Divs mit einer Tabelle in einer Tabelle in einer Tabelle gemacht :-(

          Allerdings habe ich diese Box nicht wie zunächste gedacht per HTML in die betroffenen Templates geschrieben, sondern ich habe die Template-Klasse um eine Methode erweitert, der man entsprechende Daten für so eine Box übergeben kann. Diese wird ggfs. dann automatisch im Seiten-Kopf ausgegeben. Wenn man also mal das Design ändern sollte, kann man das hier wenigstens zentral machen.

          Danke jedenfalls für Deine Hilfe!

          Grüße
          Andreas

          PS: Wobei ich immer noch nicht verstehe, warum der IE das bei einer Tabelle richtig macht, bei zwei aber falsch?!?!?

          --
          SELFHTML Linkverzeichnis: http://aktuell.de.selfhtml.org/links/
  2. Hallo,

    ich habe mir Deinen Code nicht angeschaut, aber könnte vielleicht die bekannte fehlerhafte Box-Model-Interpretation des IE Schuld sein?

    In diesem Fall solltest Du von einem der beispielsweise auf folgender Seite beschriebenen "CSS-Tricks" Gebrauch machen:

    http://tantek.com/CSS/Examples/boxmodelhack.html

    Grüße,

    Mirko

    1. Hallo!

      ich habe mir Deinen Code nicht angeschaut, aber könnte vielleicht die bekannte fehlerhafte Box-Model-Interpretation des IE Schuld sein?

      ich glaube nicht, in SELFHTML steht dazu:

      Als "Box Model Bug" wird der Fehler in älteren Windows-Versionen des Internet
      Explorers (einschließlich 5.5) bezeichnet, die Innenabstände und
      Rahmenstärken entgegen der Spezifikation nicht zur Gesamtbreite zu addieren -
      dies ist nur beim Außenabstand korrekt der Fall.

      Ich habe das Problem, dass der Außenabstand im IE innerhalb einer verschachtelten Tabelle nicht berücksichtigt wird. Wenn ich nur eine Tabelle habe - funktioniert es, wenn es zwei verschachtelte Tabellen sind - dann nicht mehr.

      div in einer Tabelle
      div in zwei verschachtelten Tabellen

      Grüße
      Andreas

      --
      SELFHTML Feature Artikel: http://aktuell.de.selfhtml.org/artikel/