• Apfeltalk ändert einen Teil seiner Allgemeinen Geschäftsbedingungen (AGB), das Löschen von Useraccounts betreffend.
    Näheres könnt Ihr hier nachlesen: AGB-Änderung
  • Wir haben den Frühjahrsputz beendet, Ihr auch? Welches Foto zu dem Thema hat Euch dann am Besten gefallen? Hier geht es lang zur Abstimmung --> Klick

[HTML] Tabellendarstellungsproblem im internet explorer

Snoopy181

Roter Astrachan
Registriert
16.02.09
Beiträge
6.333
Kennst Du für HTML-Anfänger eine einfache Alternative?
 

siris

Golden Delicious
Registriert
25.02.09
Beiträge
11
Kennst Du für HTML-Anfänger eine einfache Alternative?
Ja, ganz einfach sauberes, valides und semantisches HTML und CSS. So schwer ist das Ganze nun wirklich nicht. Es sieht nur am Anfang recht komplex aus.

Aber wenn man heutzutage in der Schule lernt, dass Frames das Richtige für "ein angemessenes Layout" sind, weil man da "mit CSS nicht viel erreichen kann", wundert mich nix mehr. :(

Um jetzt noch mal auf das eigentliche Thread-Thema zurückzukommen: Also mit dem HTML-Code von torben1 sieht die Seite bei mir im IE so aus, wie im Firefox und Safari. Die Rahmen sind dann geschlossen.
 

mschoening

Gelbe Schleswiger Reinette
Registriert
21.02.07
Beiträge
1.764
So ein Mist wie hier in diesem Thread habe ich schon lange nicht mehr gelesen :D (@torben1 und @ImperatoR ausgenommen)! Abgesehen davon wurde für @Binguit die Lösung immer noch nicht gepostet.

Das ist zwar nichts weltbewegendes aber ein persönliches "pet peeve" von mir: Webseiten werden nicht mit HTML programmiert sondern geschrieben. HTML schreibt man und programmiert man nicht oder führ euer HTML etwas aus?

Tabellen sind übrigens "out".

Tabellen (und iFrames) sind genausowenig "out" wie Links, Breaks oder andere HTML-Elemente. Der Grund weshalb hier jeder zweite gleich "Standard" schreit (übrigens ein fürchterliches Wort, klingt so nach: alles sieht gleich aus, holt eure Mao-Anzüge aus dem Schrank) ist, dass durch die Verbesserung der Browser, Elemente nicht mehr Aufgrund ihrer Layouteigenschaften verwendet werden müssen sondern wegen ihrer Semantik.

Noch vor wenigen Jahren war CSS garnicht oder nur sehr schlecht implementiert und um ein "pixel-perfect" Layout zu gestalten verwendete Man Tabellen. Jetzt ist das nicht mehr nötig und man kann Tabellen für tabellarischen Inhalt verwenden und für andere Inhalte geeignetere Elemente (definition lists, unordered lists, divs, etc.).


Für kleine Seiten und unerfahrene Programmiere oder für ganz bestimmte Inhalte sind Tabellen sinnvoller als irgendeine php-Geschichte.

Das musst du mir mal erklären. Was hat die Wahl des Markup mit PHP zu tun?

Für ein angemessenes Layout sollte man Frames verwenden, mit CSS kann man da auch nicht viel erreichen.

Die Entscheidung Frames zu verwenden sollte nicht getroffen werden weil man schöne Layouts damit bauen kann sondern weil sie Semantisch passen (was äußerst selten oder nie der Fall ist).


Wenn ich eine Seite nur mit HTML programmiere und lediglich CSS verwende, um mir die Formatierung jeder einzelnen Datei zu ersparen, bleiben mir für Sachen wie Titelleiste und Index auf einer Seite nur zwei Möglichkeiten: Tabellen (was, wie Du bereits gesagt hast, eine riesige Friemelei ist) und Frames (was deutlich einfacher ist).

Was Tabellen mit der Titelleiste zu tun haben verstehe ich nicht.

Ich teile meine Inhalte in einzelne Segmente auf (Div-Tags) und formatiere diese dann mittels CSS.

Das ist auch nicht immer angebracht. Oft gibt es elegantere Methoden um div-itis zu vermeiden.

So jetzt zur Lösung:

Als erstes solltest du dich für ein Doctype entscheiden (sonst bringt der Validator auch nichts weil er nicht weiss nach welchen Kriterien er validieren soll).

XHTML ist seit einiger Zeit wohl der meist verbreitetste Doctype aber in Anbetracht auf das kommende HTML5 und der "falschen" content-type declaration bei XHTML ist das eine persönliche Entscheidung und nicht schlechter oder Besser als HTML 4.01. XHTML hilft zu Beginn sauberes Markup zu schreiben (Elemente müssen geschlossen werden und Attribute so wie Tags klein geschrieben werden). Des weiteren sind Attribute wie align oder height "deprecated".

Da du dich bestimmt noch nicht sehr mit dieser Thematik beschäftigt hast habe ich im Beispiel XHTML 1.0 Transitional verwendet (verzeiht mehr als Strict).

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Wenn du mir ein Bild vom Fertigen Layout und dessen Inhalt schickst erkläre ich dir gerne wie du es richtig einbaust (es hängt vom Inhalt ab deswegen erklär mal ein bisschen mehr)! Den Blinkenden Rand baust du zum Beispiel nicht mehr in die Tabelle sondern legst ihn als Hintergrund:

Code:
<!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" xml:lang="en" lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

	<title>Banner</title>
	
	<style type="text/css" media="screen">
		* {
			border: 0;
			margin: 0;
			padding: 0;
		}
		
		a:link, a:visited {
			text-decoratio: none;
		}
		
		a:hover, a:active {
			text-decoration: underline;
		}
		
		table {
			background: url(http://www.partnerbridge.de/images/anim.gif) repeat;
			padding: 2px;
			width: 300px;
		}
		
		table .picture {
			background: grey;
			height: 80px;
			text-align: center;
			width: 80px;
		}
		
		table .text {
			background: black;
			width: 220px;
		}
	</style>
</head>

<body>
	<table border="0" cellspacing="0" cellpadding="0">
		<tr>
			<td class="picture">1</td>
			
			<td class="text">Here goes some text.</td>
		</tr>
		
		<tr>
			<td class="picture">2</td>
			
			<td class="text">Here goes some text.</td>
		</tr>
	</table>
</body>
</html>

Edit: Die neuen Posts habe ich hier nicht berücksichtigt.

LG,
Max
 
  • Like
Reaktionen: ImperatoR und Bigunit

Snoopy181

Roter Astrachan
Registriert
16.02.09
Beiträge
6.333
So ein Mist wie hier in diesem Thread habe ich schon lange nicht mehr gelesen :D (@torben1 und @ImperatoR ausgenommen)! Abgesehen davon wurde für @Binguit die Lösung immer noch nicht gepostet.

Woher soll ich wissen, dass es so falsch ist, wenn ich es so gelernt habe? Und warum kann man hier nicht mal konstruktive Kritik anbringen statt solcher Sprüche wie "kennst Du den Satz von Dieter Nuhr?".

Im Gegensatz zu allen, die hier groß ihre Klappe aufmachen und mir sagen, was ich doch für einen Sch*** poste, vergesst ihr eins: Ich habe wenigstens versucht, dem TE zu helfen. Das es falsch war, wusste ich nicht, wenn ich es gewusst hätte, hätte ich nichts gepostet. Habt ihr noch nie irgendetwas falsch gemacht? Kann man nicht einfach schreiben "Sorry Snoopy, aber das ist leider falsch!" und dann auch mal eine Lösung posten?
 

mschoening

Gelbe Schleswiger Reinette
Registriert
21.02.07
Beiträge
1.764
@Snoopy181: Ich formuliere es mal schön einfach: wenn ich einen Brand mit der Spiritus Flasche lösche war das vielleicht nett gemeint aber wenn der Feuerwehrmann dann sagt es sei "Mist" ist das nichts schlimmes, das hier ist ein Forum und da versucht jeder dem TS zu helfen und nur weil du gerne mit Frames liebäugelst bist du ja noch kein schlechter Mensch und solltest dich auch auf keinen Fall angegriffen fühlen ;)!

LG,
Max
 

Bigunit

Carola
Registriert
28.05.09
Beiträge
108
Hallo Max,

schonmal danke für das Beispiel oben. Wenn ich das im Internet Explorer lade blinkt allerdings nicht der Rahmen, sondern linke Tabelleninhalt (mit 1 2)

vg
 

Snoopy181

Roter Astrachan
Registriert
16.02.09
Beiträge
6.333
@Snoopy181: Ich formuliere es mal schön einfach: wenn ich einen Brand mit der Spiritus Flasche lösche war das vielleicht nett gemeint aber wenn der Feuerwehrmann dann sagt es sei "Mist" ist das nichts schlimmes, das hier ist ein Forum und da versucht jeder dem TS zu helfen und nur weil du gerne mit Frames liebäugelst bist du ja noch kein schlechter Mensch und solltest dich auch auf keinen Fall angegriffen fühlen ;)!

Danke :) Mir ging es nur darum, dass andere (nicht Du!) meiner Meinung nach nicht den richtigen Ton treffen. Ich lasse mich auch gerne korrigieren, da kann auch ich nur von lernen!:)
 

rumsi

Mecklenburger Orangenapfel
Registriert
24.03.08
Beiträge
2.979
... nur weil du gerne mit Frames liebäugelst bist du ja noch kein schlechter Mensch und solltest dich auch auf keinen Fall angegriffen fühlen ;)!

DAS sehe ich anders! und noch schlimmer wirds, wenn er dann den Text "sollte Ihr Browser keine Frames unterstützen..." einbaut. Dann wirds erst richtig kritisch!

Um es mal weniger überspitzt auszudrücken. Frames sind allein aus barrierefreundlicher Sicht absolut unangemesse.
Früher war das ein gängiges Mittel, Webseiten zu Layouten. Früher. Das man "mit der Zeit gehen sollte" bedeutet dahingehend nicht, dass man immer auf dem neuesten Stand sein muss, sondern viel mehr, dass man sich dem neuesten Stand bewusst sein muss.
Der Satz "Ich habe das so gelernt" ist eine Ausrede welche es in der IT nicht gibt. Informationstechnoligie gilt als Synonym für "ewiges Lernen".
Dazu zählt im übrigen auch, dass man sich beim zweiten mal "nein das ist falsch" darum bemühen sollte sich aktuelle Informationen zu dem Thema anzueignen.
Ebenso ist die Trennung von Techniken und Fachbegriffen wichtig. Jemand der Äpfel mit Birnen vergleicht ist nunmal nicht kompetent.


Danke,
Micha
 

Bigunit

Carola
Registriert
28.05.09
Beiträge
108
DAS sehe ich anders! und noch schlimmer wirds, wenn er dann den Text "sollte Ihr Browser keine Frames unterstützen..." einbaut. Dann wirds erst richtig kritisch!

Um es mal weniger überspitzt auszudrücken. Frames sind allein aus barrierefreundlicher Sicht absolut unangemesse.
Früher war das ein gängiges Mittel, Webseiten zu Layouten. Früher. Das man "mit der Zeit gehen sollte" bedeutet dahingehend nicht, dass man immer auf dem neuesten Stand sein muss, sondern viel mehr, dass man sich dem neuesten Stand bewusst sein muss.
Der Satz "Ich habe das so gelernt" ist eine Ausrede welche es in der IT nicht gibt. Informationstechnoligie gilt als Synonym für "ewiges Lernen".

Danke,
Micha

Danke für Deinen Beitrag, nur leider trägt er überhaupt nicht zum Thema bei. Und irgendwie gleitet das gerade in einer Diskussion über Webstandards ab :)
 

mschoening

Gelbe Schleswiger Reinette
Registriert
21.02.07
Beiträge
1.764
Wie gesagt poste doch bitte mal den Inhalt. Man kann das ganze zB auch so schreiben:

Code:
<!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" xml:lang="en" lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

	<title>Banner</title>
	
	<style type="text/css" media="screen">
		* {
			border: 0;
			margin: 0;
			padding: 0;
		}
		
		.clearfix:after {
			clear: both;
			content: ".";
			display: block;
			height: 0;
			visibility: hidden;
		}
		
		a:link, a:visited {
			text-decoratio: none;
		}
		
		a:hover, a:active {
			text-decoration: underline;
		}
		
		#test {
			background: url(http://www.partnerbridge.de/images/anim.gif) repeat;
			padding: 2px;
			width: 300px;
		}
		
		#test dl dt {
			background: #555;
			height: 80px;
			float: left;
			width: 80px;
		}
		
		#test dl dd {
			background: #000;
			float: left;
			height: 80px;
			width: 220px;
		}
	</style>
	
	<!--[if IE]>
	<style type="text/css" media="screen">
		.clearfix {
			zoom: 1;
		    display: block;
		}
	</style>
	<![endif]-->
</head>

<body>
	<div id="test">
		<dl class="clearfix">
			<dt></dt>
		
			<dd></dd>
		</dl>
	
		<dl class="clearfix">
			<dt></dt>
		
			<dd></dd>
		</dl>
	</div>
</body>
</html>

Hier wurde die Tabelle durch eine Definitions Liste ersetzt. Dieses Szenario ist denkbar wenn du zum Beispiel einen Twitter Feed codest und links immer das Avatar (der Definitions Term dt) und rechts den Tweet (dd) anzeigen möchtest...

LG,
Max
 

FloydThreepwood

Stechapfel
Registriert
19.01.06
Beiträge
161
@mschoening: Mal nur aus Neugier: Spielt der Clear-Bug bei IE8 immernoch ein Rolle? Hab noch nicht viel damit ausprobiert, aber laut werbung sind ja die hasLayout Bugs weg, oder?
 

Bigunit

Carola
Registriert
28.05.09
Beiträge
108
Ich habe eine Lösung für dieses aktuelle Problem gefunden. Danke für alle, die in diesem Thread an einer Lösung interessiert waren und geholfen haben :)
 

mschoening

Gelbe Schleswiger Reinette
Registriert
21.02.07
Beiträge
1.764
@mschoening: Mal nur aus Neugier: Spielt der Clear-Bug bei IE8 immernoch ein Rolle? Hab noch nicht viel damit ausprobiert, aber laut werbung sind ja die hasLayout Bugs weg, oder?

Ich muss ganz ehrlich sagen ich habe keine Ahnung. In letzter Zeit habe ich ausschließlich für Webkit und Gecko CSS geschrieben und mich mit IE8 noch kaum beschäftigt. Werde es mir mal anschauen!

LG,
Max