Lizzy: Tabelle / Bildschirmauflösung

Hallo!

Poste zunächst mal die Links zur HTML-Datei und zum CSS:

www.ernaehrungsberatung-witthohn.de
www.ernaehrungsberatung-witthohn.de/ibcss.css

Komme mit meinem Problem irgendwie nicht weiter:

Meine Seite wird bei 1024x768 korrekt angezeigt, und bei einer geringeren Auflösung wird der Text oberhalb der Tabelle (Galerie) in der Mitte auch schmaler, so wie es sein soll. Nur die Breite der Tabelle ändert sich nicht, sie wird von den absolut positionierten Elementen rechts verdeckt.

Hatte die Tabelle zunächst auch absolut positioniert, und habe dies dann geändert, weil ich dachte, es liegt vielleicht daran. Hat sich aber nichts geändert. Außerdem wird sie ohne absolute Positionierung immer ein Stück nach rechts versetzt dargestellt, egal was für Randeinstellungen ich links setze.

Bin noch Anfänger und schon froh, daß ich die Seite überhaupt so hinbekommen habe. Wäre die Krönung, wenn sich das Problem mit der Auflösung mit Eurer Hilfe jetzt auch noch lösen würde ;-)

Kann mir da jemand helfen?

Gruß,

Lizzy

  1. Hi,

    Nur die Breite der Tabelle ändert sich nicht, sie wird von den absolut positionierten Elementen rechts verdeckt.

    sie kann nicht schmaler werden, als die Inhalte Platz brauchen. Dass die Seite breiter wird, liegt daran und an dem rechten margin. Aber weil Du die rechte Box mit position:absolute aus dem Fluss genommen hast, kann sie nicht berücksichtigt werden.

    Du könntest z.B. float verwenden - anstatt der Tabelle oder für die rechte Box.
    Im ersten Fall würden die jetzigen Tabellenblöcke sich untereinander anordnen und im zweiten Fall die ganze Tabelle unterhalb der rechten Box rutschen.

    Eine andere Lösung wäre die Angabe einer Mindestbreite für die Seite.

    P.S.: schmeiss doch auch das antiquierte Javascript raus; das wirft am Laufenden Band Fehlermeldungen.

    freundliche Grüße
    Ingo

    1. Hallo Ingo,

      erst mal danke für Deine Hilfe.

      Das mit der Mindestbreite scheint mir die einfachste Sache zu sein. ;-) Denke, dann muß der User mit der geringeren Bildschirmauflösung einfach scrollen? Wage gar nicht zu fragen, aber wie und wo stelle ich die Mindestbreite für die ganze Seite ein? Body / minwidth? Ansonsten wage ich mich mal an "float"...

      Habe Javascript extra nur für nicht unbedingt notwendige Dinge benutzt wie Datum, BMI und so weiter. Werde mich aber mal nach Alternativen umschauen...

      Gruß, Lizzy

      Sorry für die vielleicht etwas seltsamen Fragen, aber ich habe erst vor drei Wochen angefangen, mich mit CSS zu beschäftigen und meine Seite durch Trial und Error damit zusammenzubauen...

      Hi,

      Nur die Breite der Tabelle ändert sich nicht, sie wird von den absolut positionierten Elementen rechts verdeckt.
      sie kann nicht schmaler werden, als die Inhalte Platz brauchen. Dass die Seite breiter wird, liegt daran und an dem rechten margin. Aber weil Du die rechte Box mit position:absolute aus dem Fluss genommen hast, kann sie nicht berücksichtigt werden.

      Du könntest z.B. float verwenden - anstatt der Tabelle oder für die rechte Box.
      Im ersten Fall würden die jetzigen Tabellenblöcke sich untereinander anordnen und im zweiten Fall die ganze Tabelle unterhalb der rechten Box rutschen.

      Eine andere Lösung wäre die Angabe einer Mindestbreite für die Seite.

      P.S.: schmeiss doch auch das antiquierte Javascript raus; das wirft am Laufenden Band Fehlermeldungen.

      freundliche Grüße
      Ingo

      1. Hi,

        Das mit der Mindestbreite scheint mir die einfachste Sache zu sein. ;-) Denke, dann muß der User mit der geringeren Bildschirmauflösung einfach scrollen? Wage gar nicht zu fragen, aber wie und wo stelle ich die Mindestbreite für die ganze Seite ein? Body / minwidth?

        das wäre eine Möglichkeit. Aber ob der IE6 da mitspielt, weiß ich nicht. Vielleicht besser ein DIV um die ganze Seite und diesem min-width sowie über den * html - Hack width für den IE6 angeben.

        Habe Javascript extra nur für nicht unbedingt notwendige Dinge benutzt wie Datum, BMI und so weiter. Werde mich aber mal nach Alternativen umschauen...

        Ich meine dieses Script:
        [code lang=javascript]var ie = document.all ? 1 : 0
        var ns = document.layers ? 1 : 0

        if(ns){doc = "document."; sty = ""}
        if(ie){doc = "document.all."; sty = ".style"}[(code]
        ...
        Da es seit über 10 Jahren auch andere zu berücksichtigende Browser als den IE und Netscape 4 gibt, solltest Du es wirklich rausschmeissen. Bei jeder kleinsten Mausbewegung kommt eine Fehlermeldung, das "doc" nicht definiert ist.
        Tooltipps gehen auch mit CSS: http://www.1ngo.de/web/infobox.html

        Und das JS-Datum ist auch nicht gerade ein sinnvoller Mehrwert.

        freundliche Grüße
        Ingo

        1. Vielleicht besser ein DIV um die ganze Seite und diesem min-width sowie über den * html - Hack width für den IE6 angeben.

          Hallo Ingo,

          vielen Dank für den Tipp mit der Mindestbreite! Habe ein DIV um den Body gelegt und sowohl der IE als auch Firefox scheinen die min-width richtig zu interpretieren - zumindest schon mal für die erste Box! Denn die zweite wird nach wie vor in alter Manier dargestellt, was mich ehrlich gesagt vor ein erneutes Rätsel stellt, denn auch diese Box ist doch in den min-width "seite" eingeschlossen?! Hast Du vielleicht noch eine Idee, woran dies jetzt liegen könnte?
          Poste noch mal die Links zu CSS und HTML:

          www.ernaehrungsberatung-witthohn.de/index.html
          www.ernaehrungsberatung-witthohn.de/ibcss.css

          Gruß, Lizzy