HTML Tables

iFlyPlanes

Grünschnabel
Hallo allerseits,

ich bräuchte Hilfe beim Erstellen eines Tables.
Konkret geht es darum, dass ich ein (.psd) Design in ein HTML-Template verwandeln soll. (Wird dann als HTML-Newsletter versand) Um das zu erreichen habe ich eine Tabelle in HTML erstellt, welche die diversen Bilder des Designs enthält.

Das aktuelle Problem:

Ich habe eine Tabelle mit derzeit 10 Spalten.

Die erste und letzte Spalte haben das Atribut rowspan = "19" gehen also über den ganzen Table.
Innerhalb dieser beiden Spalten ist der restliche Content.

Wenn ich nun eine Zeile wie folgt gestalten will, dann funktioniert das Problemlos:

HTML:
<tr>
  <td width="254"></td>
  <td colspan="7" width="100%">testtext</td>
</tr>

sobald ich aber Inhalt in die erste Zelle schreibe, "zerreist" die Tabelle.

HTML:
<tr>
  <td width="254">testtext1</td>
  <td colspan="7" width="100%">testtext2</td>
</tr>

Hat jemand eine Ahnung was ich hier falsch mache?
Nach meinem Verständnis hat die erste Zelle sowieso 254px Breite, also sollte ich da doch auch was reinschreiben können ohne dass der Rest "kaputt" wird?

Kann gerne auch noch mehr des Codes posten, wenn das zu allemein gehalten war.

Danke im Vorraus, LG
Tom
edit:

Hier der gesamte Code:

HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>

<BODY bgcolor="ffffff">
<table width="728" border="0" cellpadding="0" cellspacing="0">
	<tr>
		<td width="30" height="20"></td>
		<td width="254" height="20"></td>
		<td width="68" height="20"></td>
		<td width="27" height="20"></td>
		<td width="59" height="20"></td>
		<td width="71" height="20"></td>
		<td width="43" height="20"></td>
		<td width="86" height="20"></td>
		<td width="65" height="20"></td>
		<td width="25" height="20"></td>
	</tr>

	<tr>
		<!-- border left -->
		<td rowspan="19">
			<img src="G:/Work/ringseis/Slices/images/border_left.jpg">
		</td>
		<td>
		</td>
		<td>
		</td>
		<td>
		</td>
		<td>
		</td>
		<td>
		</td>
		<td>
		</td>
		<td>
		</td>
		<td>
		</td>

		<!-- border right -->
		<td rowspan="19">
			<img src="G:/Work/ringseis/Slices/images/border_right.jpg">
		</td>
	</tr>

	<tr>
		<td colspan="6">
			<img src="G:/Work/ringseis/Slices/images/top_middle.jpg">
		</td>
		<td>
			<img src="G:/Work/ringseis/Slices/images/shop.jpg">
		</td>
		<td>
			<img src="G:/Work/ringseis/Slices/images/web.jpg">
		</td>
	</tr>

	<tr>
		<td colspan="8">
			<img src="G:/Work/ringseis/Slices/images/top_logo.jpg">
		</td>
	</tr>

	<tr>
		<td colspan="5">
			<img src="G:/Work/ringseis/Slices/images/divider_1.jpg">
		</td>
		<td colspan="3">
			<img src="G:/Work/ringseis/Slices/images/newsletter.jpg">
		</td>
	</tr>

<!-- content 1 -->
	<tr>
		<td colspan="8" height="33">d</td>
	</tr>

	<tr>
		<td width="254"></td>
		<td colspan="7" width="100%">d</td>
	</tr>
	
</table>
</BODY>
</HTML>
 
Zuletzt bearbeitet:
M

Maik

Hi,

hast du mal einen Screenshot der "zerschossenen" Tabelle zur Hand? Ich kann davon nämlich nichts erkennen, wenn ich in besagter Zelle Text einfüge.

mfg Maik
 

iFlyPlanes

Grünschnabel
Hi Maik,

erstmal danke für die Antwort!

Ich konnte dieses spezifische Problem beheben. Leider weiß ich nicht mehr genau welche von den 100.000 Änderungen genau verantwortlich war, aber es lag irgendwie daran, dass ich ein falsches colspan verwendet habe.

Vielleicht hast du aber für das nächste Problem eine Idee ;-)

Das Template hat soweit schon ganz in Ordnung ausgesehen (in FF, warum IE das kaputt macht ist ein anderes Mysterium):

http://www.blessedsoftware.com/bab/template2.html

Jetzt ist der Wunsch aufgekommen, dass die beiden Logos ganz oben und unten, verlinkt werden sollen.

Ich dachte, dass ich nur die Logografik die derzeit von ganz links bis ganz rechts geht, in 3 Teile schneiden muss und dann den linken Teil über 3 Spalten, die Mitte über 4 Spalten und den rechten Teil dann wieder über 3 Spalten anzeigen lasse.
Somit hätte ich wieder alle 10 im Table vorhandenen Spalten benutzt.

Leider passiert folgendes wenn ich es so versuche:

http://www.blessedsoftware.com/bab/template3.html

Hat irgendjemand eine Idee aus welcher Ecke der Fehler kommt? (Sinds die Spalten, die Bildgrößen, etc..) ?

Danke und Grüße
Tom
 
M

Maik

Hi,

warum willst du denn überhaupt die beiden Logos in mehrere Teile zerschneiden?

HTML:
<a href="#"><img src="http://www.blessedsoftware.com/bab/images_2/top_middle_2.jpg" width="553" height="33"></a>

...

<a href="#"><img src="http://www.blessedsoftware.com/bab/images_2/bottom_logo_2.jpg" width="100%"></a>


Ansonsten nutze den "Bildüberschuß" dieser Grafiken als Hintergrundbild für die Tabellenzellen, und platziere darin das zurechtgeschnittene Logo mittels den Attributen valign="middle" und align="center".

mfg Maik