Florian: Spaltenbreite variiert

Über einem Hintergrundbild habe ich eine Tabelle mit zwei Spalten liegen. Das Hintergrundbild ist optisch in einen dunklen linken und einen hellen rechten Bereich gegliedert. Weil über dem dunklen Bereich weiß und über dem hellen schwarz geschrieben werden soll, muss die Tabelle exakt mit dem Hintergrundbild übereinstimmen.

Doch leider ist die linke Spalte in verschiedenen Browsern unterschiedlich breit. Der dunkle Bereich des Hintergrundbildes hat eine Breite von 250 Pixel, der body eine margin-left von 10 Pixel.

Rechne ich das cellpadding der Tabelle von 10 Pixel ein und setze die linke Tabellenspalte auf eine Breite von 220 Pixel, dann passt es im IE 5 für PC und in Safari für Mac, im IE 5 für Mac ist die linke Spalte aber zu schmal. Rechne ich das cellpadding nicht ein und setze die Spaltenbreite auf 240 Pixel, dann passt die linke Spalte im IE 5 für Mac, ist aber im IE 5 für PC und in Safari zu breit.

Ich hoffe, dass man mit diesen Browser-Spinnereien nicht leben muss und dass es eine geniale Lösung für mein Problem gibt.

  1. hi

    Ich hoffe, dass man mit diesen Browser-Spinnereien nicht leben muss und dass es eine geniale Lösung für mein Problem gibt.

    tja dumme sache so ein pixelgenaues layout. das wird sicher nie 100% übereinstimmung geben.

    also überdenke dein layout und gebe der tabelle die hintergrundfarbe/bild und.

    ich selbst versuche z.b. die eigenschaft padding (ich weiss das hat nix mit cellpadding zu tun) zu vermeiden. Der IE behandelt den Innenabstand so, wie man es will. Netscape addiert padding aber oft zur eigenschaft width dazu.
    tschö!

    1. Hallo "me",

      Der IE behandelt den Innenabstand so, wie man es will. Netscape addiert
      padding aber oft zur eigenschaft width dazu.

      Und macht es damit richtig. Der IE schafft das auch, wenn man in durch
      die Angabe eines Doctypes in den standardgerechten Zustand versetzt.
      Nur weil Du es als falsch empfindest, ist es noch lange nicht.

      • Tim
  2. hallo.

    Ich hoffe, dass man mit diesen Browser-Spinnereien nicht leben muss und dass es eine geniale Lösung für mein Problem gibt.

    Du könntest statt der Tabelle <div>s über das hintergrundbild legen, und absolute positionieren.

    mfg nag

  3. Hallo,

    Ich hoffe, dass man mit diesen Browser-Spinnereien nicht leben muss und dass es eine geniale Lösung für mein Problem gibt.

    naja, wohl kaum, aber wenn's wirklich drauf ankommt finde ich immer noch Folgendes am sichersten:

    1. Tabelle am Fensterrand anschlagen lassen (topmargin=0 leftmargin=0 marginheight=0 marginwidth=0 im Body-Tag)
    2. cellpadding UND cellpspacing für die Tabelle einstellen (im Zweifel 0).
    3. Tabellenzellen auf width=0 stellen.
    4. Platzhalterzellen mit Pixelgifs sperren (<img src="..." width=xxx height=xxx).

    Safari für Mac

    kenn ich ja gaaar nicht. ist der gut?

    Gruß, Andreas

    1. Hallo Andreas,

      Safari für Mac
      kenn ich ja gaaar nicht. ist der gut?

      Ich finde ja. Zumindest beim Rendern. Die UI ist für einen langjährigen
      Sidebarbenutzer wie mich etwas gewöhnungsbedürftig.

      Safari basiert auf KHTML, der Rendering Engine von Konqueror, wird
      fleißig weiterentwickelt und die Änderungen fließen auch wieder
      zurück. Open Source eben.

      Allerdings ist er im Moment erst bei Beta 2. Er ist trotzdem gut
      benutzbar, allerdings würde ich ihn erstmal noch vorsichtig
      einsetzen, wie jede Betasoftware. Vor ein paar Wochen würde über
      eine Lücke in der SSL-Implementierung berichtet. Es wird gemunkelt,
      die 1.0 käme am 23. Juni heraus.

      Hier Apples Seite dazu:
        http://www.apple.com/de/safari/

      Und hier für eventuelles Interesse das Weblog eines der leitenden
      Entwickler (1 & 2):
        http://weblogs.mozillazine.org/hyatt/

      (1) Ja molily, ein Technokratenblog. Trotzdem ab und an interessant.
      (2) Der Kerl hat auch schon bei Mozilla, Phoenix und Camino mitgearbeitet.

      • Tim