Hans Müller: Elemente horizontal positionieren

SELF-Forum

Elemente horizontal positionieren

Hans Müller
– Informationen zu den Bewertungsregeln

Hallo,

folgendes Problem.

Seite mit drei Bereichen: links Menu 200 breit, Mitte Inhalt 500 breit, rechts Kasten 200 breit.
Alles mit CSS und div's gemacht.

Jetzt will ich das Ganze auf prozentuale Angaben umstellen (20%, 50%, 20%), um auch eine Darstellung auf kleineren Monitoren zu ermöglichen.

Alle Elemente sind positioniert (top, left).
Wenn die Seite nun verkleinert wird, werden die div-Bereiche zwar entsprechend angepasst, aber es entseht ein großer Abstand von dem mittleren zum rechten Bereich, da die Positionsangabe des rechten Bereiches (left:xxx px) natürlich nicht mehr stimmt.

Kann ich das irgendwie anpassen, etwa "rechter Bereich fängt 20px neben dem Hauptbereich an?

Ein zweites Problem: ich habe die Seite unter Netscape 4.7 getestet -der scheint ja nicht einmal die einfachsten CSS-Angaben zu verstehen?

Wer kann mir da helfen?
MfG
Hans

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. Elemente horizontal positionieren

    Thomas J.S.
    – Informationen zu den Bewertungsregeln

    Hallo,

    Jetzt will ich das Ganze auf prozentuale Angaben umstellen (20%, 50%, 20%), um auch eine Darstellung auf kleineren Monitoren zu ermöglichen.

    http://css.fractatulum.net/sample/layout2format.htm sollte dir dazu Anhaltspunkte geben.

    Grüße
    Thomas

    PS: zu Frage 2: jein.

    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

    1. Elemente horizontal positionieren

      Hans Müller Homepage des Autors
      – Informationen zu den Bewertungsregeln

      Hallo,

      danke für den Linktipp. Hat mir sehr geholfen.

      Jetzt habe ich nur noch zwei kleine Probleme:

      meine obere horizontale Navigationsleiste mit

      <div style="position:absolute; left:0px; top:67px; margin-left:10px; margin-right:10px;

      right:0px; background-color:red; width:100%">
        </div>

      ist bei Aufruf im IE5 zu kurz, also nicht über die ganze Seitenbreite verteilt, sondern nur ca. 50%. Was ist da los?

      1. Die untere Navigationsleiste ist genauso definiert, wird aber korrekt über 100%-Breite angezeigt.
        Allerdings: trotz Angabe von "margin-top:15px" ragt der Text des darüberliegenden Bereiches rein.

      Ich hab' auch mal die URL zur Seite angegeben.

      MfG
      Hans

      Beitrag melden
      –
      Informationen zu den Bewertungsregeln

      1. Elemente horizontal positionieren

        Thomas J.S.
        – Informationen zu den Bewertungsregeln

        Hallo,

        danke für den Linktipp. Hat mir sehr geholfen.

        Jetzt habe ich nur noch zwei kleine Probleme:

        Sorry, dass ich das sage, aber so wie die HTML-Seite im Moment aussieht, kann ich dir nicht helfen, es sind zu viele Fehler im Quellcode.

        Z.B. solche :<td class=leistewidth="16%"

        Grüße
        Thomas

        -----------------------------------
        line 7 column 1 - Warning: <style> lacks "type" attribute
        line 112 column 3 - Warning: <img> lacks "alt" attribute
        line 120 column 109 - Warning: discarding unexpected </font>
        line 120 column 116 - Warning: discarding unexpected </strong>
        line 123 column 22 - Warning: discarding unexpected </font>
        line 123 column 29 - Warning: discarding unexpected </strong>
        line 124 column 5 - Warning: <td> unexpected or duplicate quote mark
        line 124 column 5 - Warning: <td> unknown attribute value "(null)"
        line 127 column 70 - Warning: discarding unexpected </font>
        line 127 column 77 - Warning: discarding unexpected </strong>
        line 129 column 65 - Warning: discarding unexpected </font>
        line 129 column 72 - Warning: discarding unexpected </strong>
        line 131 column 62 - Warning: discarding unexpected </font>
        line 131 column 69 - Warning: discarding unexpected </strong>
        line 140 column 56 - Warning: replacing unexpected </em> by </font>
        line 140 column 61 - Warning: discarding unexpected </font>
        line 149 column 3 - Warning: <table> unexpected or duplicate quote mark
        line 177 column 3 - Warning: <table> unexpected or duplicate quote mark
        line 234 column 56 - Warning: discarding unexpected </em>
        line 234 column 61 - Warning: discarding unexpected </font>
        line 235 column 80 - Warning: missing </font> before </p>
        line 235 column 80 - Warning: trimming empty <font>
        line 235 column 80 - Warning: missing </em> before </p>
        line 235 column 80 - Warning: trimming empty <em>
        line 235 column 80 - Warning: missing </font> before </p>
        line 235 column 80 - Warning: trimming empty <font>
        line 236 column 7 - Warning: discarding unexpected </font>
        line 236 column 14 - Warning: discarding unexpected </em>
        line 236 column 19 - Warning: discarding unexpected </font>
        line 246 column 24 - Warning: discarding unexpected </font>
        line 250 column 1 - Warning: <table> lacks "summary" attribute

        Beitrag melden
        –
        Informationen zu den Bewertungsregeln