Variable Auflösung

Christian B

Hallo,

mein 2. Eintrag und es geht um den gleichen Code. Ich habe eine Tabelle für eine Joomla Template.
Ich will eine feste Kopfzeile mit 150px und eine feste Fußzeile mit 80px. Die mittlere linke Zelle beinhaltet das Menü und die mittlere rechte Zelle den Inhalt. Nun kommt in den mittlere rechte Zelle noch ein Div mit overflow, so dass dort später bei langem Inhalt ein Scrollbalken kommt.
Ansonsten soll die Seite den ganzen Bildschirm ausfüllen. Da habe ich mir folgendes gedacht: die Kopfzeile mit height="150px", die Fußzeile mit height="80px" und die mittlere Zeile entsprechend mit height="100%".
Leider klept jetzt die Kopfzeile mit der Fußzeile zusammen... Der Inhalt ist im Moment noch leer. Sollte aber keine Rolle spielen.

Das gleiche Prinzip gibt's ja auch mit dem width Befehl. Da werden dann ja die Spalten auf die ganze Seite gedehnt. Warum geht das bei der Höhe nicht?

Unten kommt noch mal der Code.

Gruß
Christian

HTML

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


  <meta content="text/html; charset=ISO-8859-1" http-equiv="content-type">
  <title>Test Layout</title>
  <style type="text/css"></style>


</head>




<body style="margin: 0px; background-color:#28b109;">


<table height="100%" width="100%" border="0" cellpadding="1" cellspacing="0">


  <tbody>
    <tr>
      <td colspan="2" rowspan="1" style="text-align: left; vertical-align: top; height: 150px; background-image: url(oben.jpg);"></td>
    </tr>


    <tr>
      <td width="150px" height="100%" style="background-image:url(links.jpg);"></td>
      <td  height="100%" style="background-image: url(mitte.jpg);"></td>
    </tr>
    <tr>
      <td width="150" height="88" style="background-image: url(unten-l.jpg);"></td>
      <td height="88" style="background-image: url(unten-r.jpg);"></td>
    </tr>


  </tbody>
</table>
</body>
</html>

Alles anzeigen

Mir nicht

Wenn ich dichrichtig verstehe möchtest du eine Zelle auf die ganze Seite "dehnen".
Versuch es mal mit "cellpadding="irgendeinwert(px, %...)".

Hoffe du meinst das, denn du hast es ja bereits mit "0" angegeben!

Ronald

Moin!

1. falscher Dokumententyp
2. Verweis zur W3C im Dokumententyp zerstört Tabelleneigenschaft "height und width"

Probiere es mal so (die Ziffern in den Zellen sind nur dafür da, daß man die Zellen sieht - ich hab ja deine Grafiken nicht):

HTML

<!doctype html public "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <meta content="text/html; charset=ISO-8859-1" http-equiv="content-type">
  <title>Test Layout</title>
</head>


<body style="margin:0px; background-color:#28b109;">


<table style="height:100%;width:100%" border="1" cellpadding="1" cellspacing="0">
  <tbody>
    <tr>
      <td colspan="2" rowspan="1" style="text-align: left; vertical-align: top; height: 150px; background-image: url(oben.jpg);">1</td>
    </tr>
    <tr>
      <td style="width:150px;background-image:url(links.jpg);">2</td>
      <td style="background-image: url(mitte.jpg);">3</td>
    </tr>
    <tr>
      <td style="width:150px;height:88px; background-image: url(unten-l.jpg);">4</td>
      <td style="background-image: url(unten-r.jpg);">5</td>
    </tr>
  </tbody>
</table>
</body>
</html>

Alles anzeigen

G.a.d.M.

Ronald

Tags