Hallo zusammen,
Problem:
--------
Das Layout läuft unter allen Browsern die mir zum Testen zur Verfügung stehen soweit zufriedenstellend ausser auf dem Safari unter Mac OSX 10.2.
Die DIVS sollen unabhängig vom Inhalt die Höhe auf 100% stellen, also das ganze Browserfenster unabhängig von der Grösse füllen. Dies funktioniert auf allen Browsern solange es keine Inhalte in den divs "main" und "sub" gibt. Fügt man die divs "left", "content", "navi" und "footer" ein zeigt der Safari nur die benötigte Höhe an, was AFAIK laut W3C auch soweit ok ist.
Frage:
------
Kann man das auch für den Safari irgendwie hinbiegen, oder ist etwas Grundsätzliches im Aufbau falsch?
Aufbau des Layouts:
-------------------
html, body height:100%;
|-------------------------------|
| | |
| | |
| | |
| left | content | <-- main height:80%
| h:100% | h:100% |
| | |
|-------------------------------|
|-------------------------------|
| navi h:25% |
|-------------------------------| <-- sub height:20%
| footer h:75% |
|---|
Infos:
------
1. Ich bin über den Doctype im Quirksmode um auch für den IE6 das Boxmodell richtig darzustellen.
2. Habe auf http://www.quirksmode.org/ mit dem height-Workshop leider auch keine Lösung gefunden...
3. Screenshots, Testseite und Source gibts unter http://www.andredittmar.de/index.html
Vielleicht hat ja jemand noch eine Idee wie man das besser lösen kann? Das Menü und der Footer sollen halt immer unten am Fensterrand "kleben", der Rest des Platzes zeigt den Inhalts-Div an. Innerhalb des Divs soll später dann ein Div mit overflow:auto stehen um den Fliesstext anzuzeigen. Ich weiss dass das nicht die beste Lösung ist, aber Zwecks der CD der Firma muss die Navi leider unten stehen! Besser wäre es wahrscheinlich die Navi mit position:fixed "ranzukleben" aber der IE auf PC rafft das ja leider nicht... sonstige Ideen und/oder Anmerkungen sind gerne Willkommen!
Ich geh mal Mittag machen,
Mahlzeit :-)
Gruss AndreD