[CSS/TABLE/HTML] Tabelle über ganze Seitenbreite

Einklappen
X
Einklappen
 
  • Seite von 1
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge
Vorherige template Weiter
  • #1

    [CSS/TABLE/HTML] Tabelle über ganze Seitenbreite

    Hallo

    Ich habe hier noch ein älteres design das eine Tabelle über die gesamte Seitenbreite und die gesamte Seitenhöhe geht. Der Aufbau:
    Header (Fixe höhe von 100px)
    Content
    Footer (Fixe höhe von 50px)

    Der header soll natürlich oben sein, der footer unten und in der Mitte soll der Content den restlichen Inhalt besitzen. Die Tabelle steht, und hat für die gesamte höhe und breite folgendes:
    Code:
    * {
  margin: 0;
}

html, body {
  height: 100%;
  width: 100%;
  color: #000000;
}
    Soweit so gut. Dies klappt wunderbar. Dies klappt im IE5.5, IE6, IE8, Firefox 1 - 3, Chrome und anderen Browsern. Der IE7 zerschiesst mir jedoch das gesamte sortiment. Die fixen breiten lässt er nicht mit den 100px und 50px. Wenn ich dem content height: 100% mache passt das layout, aber der footer ist nicht am seitenende sondern ungefähr bei 150%.

    Wo könnte ich da den Fehler suchen? Danke schonmal für eure tipps.

    Gruss

    Olli
    Zuletzt geändert von Olli4; 25.05.2009, 17:02.
    Stichworte: -
  • #2
    online-beispiel verfügbar? mit den wenigen infos kann man nicht viel anfangen.

    peter
    Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
    Meine Seite

    Kommentar

    • #3
      Hi

      Nein leider habe ich momentan nicht sehr viel möglichkeiten etwas Online zu stellen. Ich habe hier kurz ein abgekürztes beispiel wo man das "phänomen" auch sehen kann. Vielleicht hilft dir ja dies ein wenig weiter.
      HTML-Code:
      <?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="de" xml:lang="de">
<head><title>testseite</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
<!--
* {
	margin: 0;
}

html, body {
  height: 100%;
	width: 100%;
	color: #121b22;
}
-->
</style>
</head>
<body>
<table cellpadding="0" cellspacing="0" border="1" style="width:100%; height:100%" align="center">
	<tr>
 		<td style="height:80px;" align="center">
 			<table style="width:960px; height:80px;" border="0">
 				<tr>
 					<td align="left">Header 1</td>
 					<td align="left">Header 2</td>
 				</tr>
 			</table> 			
 		</td>
	</tr>
	<tr>
 		<td>Der Content</td>
	</tr>
	<tr>
 		<td style="height:50px;">Footer</td>
	</tr>
</table>
</body>
      Hier siehst du es recht gut. In allen IE 5.5 - 8 geht es ausser dem 7ner der eine andere Darstellung abgibt. Wenn ich beim content 100% mache, dann wird die Seite länger als ich möchte. Also mehr als eine Seitenhöhe. Wenn es mehr text hat ist dies ja in Ordnung aber ich hätte es gerne das es auch die 100% der Seite nimmt wenn weniger Text da ist.

      Gruss

      Olli

      Kommentar

      • #4
        imho keine chance. der ie6/7 sind ziemlich eigen, was tabellen angeht. und zu layout-zwecken sollte man mit den denen eh nicht mehr arbeiten. das ist steinzeit .

        peter
        Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
        Meine Seite

        Kommentar

        • #5
          Hi

          Hm gibt es da gar keine Möglichkeit? Gibt es denn eine Möglichkeit das ich ein height: 100% setzen kann was nur für den IE7 gilt? Weil in allen anderen geht es sauber auch im IE6.

          Das mit der steinzeit da hast du sicherlich recht. Da bin ich mich am Einarbeitet. Aber das eine Layout würde ich noch gerne mit Tabellen beenden.

          Gruss

          Olli

          Kommentar

          • #6
            Zitat von Olli4 Beitrag anzeigen
            Gibt es denn eine Möglichkeit das ich ein height: 100% setzen kann was nur für den IE7 gilt?
            Stichworte: CSS Hacks; Conditional Comments
            I don't believe in rebirth. Actually, I never did in my whole lives.

            Kommentar

            • #7
              es gibt die conditional comments. und div. css-hacks speziell für den ie7. z.b. so was
              PHP-Code:
              *+html td.irgendwas
              { 
                              height: 100%;
              } 
              peter
              Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
              Meine Seite

              Kommentar

              • #8
                Hi

                Perfekt. Herzlichen Dank.

                Gruss

                Olli

                Kommentar

                Vorherige template Weiter
                Lädt...
                X