Html 100% Höhe

Re: Html 100% Höhe

ruprecht69 — Mon, 29 Oct 2007 17:58:08 GMT

Mit Tabellen macht man heutzutage kein Layout mehr. Versuch ne DIV-Lösung die bereits von einem Kollegen kam.

Re(5): Html 100% Höhe

morph1 — Mon, 29 Oct 2007 17:40:42 GMT

(3) <table height="50%" ... >

Alle modernen Browser (IE 4+, Netscape6, Mozilla0.x, Opera5.x) stellen nach (1) und (2) definierte Tabellen korrekt dar, während Netscape4 diese Definition grundsätzlich ignoriert.

Zusätzlich ist bei Mozilla0.x / Netscape6 zu beachten, daß man im Falle der Angabe nach (2) ein scheinbar falsches Verhalten dieser Browser beobachtet, d.h. die Tabelle wird scheinbar nicht auf 50% Größe gesetzt. Der Mac IE5, IE4.5 und Win-IE6b im standard-compliant-Modus verhalten sich genauso.

Dieses Verhalten ist jedoch kein Bug von Mozilla, sondern die korrekte Auslegung der modernen W3C-Standards. Nach diesen bezieht sich eine Prozentangabe stets auf die Größe des übergeordneten (Eltern) -Elements.

In diesem Falle ist <table> ein Kind von <body>, d.h. <body> ist das übergeordnete (Eltern)-Element zu <table>. Die Maße von <body> sind jedoch standardmäßig auf auto gesetzt, d.h. der Browser setzt die Größe von <body> automatisch nach dessen Inhalt, während sich

folglich bringts nix...

Re(4): Html 100% Höhe

Muggel — Mon, 29 Oct 2007 17:23:37 GMT

Was heißt es gibt keine prozentualen Höhenattribute? Klar gibts die - nur halt nicht beim <html> Tag. Dort habe ich überhaupt noch nie Attribute gesehen. Über die anderen Höhenattribute meckert der Validator auch nicht.

Re(3): Html 100% Höhe

morph1 — Mon, 29 Oct 2007 14:39:20 GMT

klar tut er das.

es gibt keine prozentualen höhenattribute mehr. die browser interpretieren sie zwar meist, aber sie sind nicht standardkonform.

kA warum, weil das ist eine sache die eigentlich jeder brauchen kann

Re(2): Html 100% Höhe

Muggel — Mon, 29 Oct 2007 14:23:20 GMT

Im Prinzip Ja

Folgender Code funktioniert sowohl im IE als auch im FF:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html style="height:100%">


    

    
<body style="height:100%">
    <table width = "100%" border="0"  cellSpacing="0" cellPadding="0" style="height:100%">
        <tr>
            <td class="MenuTD">
            
                Left Menu
            </td>
            <td class="MainTD">
            
                Working Area
            
            </td>
        </tr>
    </table>
</body>
</html>

nur leider regt sich der W3C Html-Validator über das <html style="height:100%"> auf (hab ich auch noch nie gesehen)

Re: Html 100% Höhe

koarl0815 — Mon, 29 Oct 2007 14:21:33 GMT

Hallo!

Ich hätte da auch eine Lösung mit divs:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html style="height: 100%">

<body  style="margin: 0; height:100%; padding:0; background-color: red;">

                Left Menu

                Working area

</body>
</html>

(Farben natürlich nur zu Demonstrationszwecke: Augenkrebsgefahr )
Ob du nun fürs Layouten divs oder tables nimmst bleibt aber schlussendlich dir überlassen.
Habs mitn IE leider nicht testen können, zumindest die Gecko-Engine verhält sich so wie erwartet.

Lg,
Karli

Re: Html 100% Höhe

redbull1970 — Mon, 29 Oct 2007 12:55:52 GMT

Prozentuale Werte: Beziehen sich auf Höhe des Eltern-Elements

Um für ein Element innerhalb des <body>-Tags eine Höhe von 100% einzustellen, solltest du für das <body>- und das <html>-Tag ebenfalls die Höhe auf 100% festlegen, damit es in allen Browsern funktioniert

Aus: http://www.css4you.de/height.html

Re: Html 100% Höhe

Knurz — Mon, 29 Oct 2007 11:40:32 GMT

body marginwidth=0 marginheight=0 leftmargin=0 rightmargin=0 topmargin=0

glaub das suchst du

Html 100% Höhe

Muggel — Mon, 29 Oct 2007 11:15:31 GMT

Ich versuche eine saubere Lösung mit Tabellen für eine seitliche Menüleiste über die volle Höhe zu finden. Die Lösung soll natürlich sowohl im IE als auch im FF funtionieren. Irgendwie gelingt mir das nicht.


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>


  
<body  style="height:100%">
    <table style="height:100%">
        <tr>
            <td class="MenuTD"  style="height:100%">
            
                Left Menu
            <td>
            <td  style="height:100%">
            
                Working Area
            <td>
        <tr>
    </table>
</body>

</html>

Das funtioniert zwar im IE, FF stellt die Meüleiste aber nicht über die volle Höhe dar.
Zumindest nicht, wenn ich als Doctype strict oder loose verwende. Nur wenn ich den Doctype ganz weglasse, stellt auch FF das über die volle Höhe dar. Ich bin verwirrt