Problem bei Design von HTML Tabelle

keksi77 · 15.11.2005, 11:22

Hallo,

Ich kenne mich zwar nicht so schlecht bei HTML und CSS aus, komme aber bei diesem Problem nicht weiter.

Brauche eine Tabelle mit drei Zeilen aber jetzt kommts
Erste Zeile sollte nur 2 Spalten haben und die restlichen zwei Zeilen je 5 Spalten zu je 20% Breite.

Wie mache ich jetzt diese Tabelle das in der ersten Zeile nur zwei Spalten sind und diese aber genau über den anderen Spalten auf den anderen Zeilen liegen?

Wer kann mir helfen?

Danke
Horst

Schappenberg · 15.11.2005, 12:38

Ich glaub du brauchst "colspan" und "rowspan" wenn ich dich richtig verstanden hab.
Näheres siehe Selfhtml

bully · 15.11.2005, 13:04

Entweder du bastelst zwei Tabellen, oder du nimmst colspan wie oben von Schappenberg beschrieben, allerdings solltest dann eine gerade Anzahl an Spalten darunter haben, colspan versteht nur ganze Zahlen. (jeweils zwei = 4 Spalten darunter oder jeweils 3, sechs Spalten darunter)

lg
bully

Preacher · 15.11.2005, 13:40

Kleiner Workaround:

<html>
<head>
<style>
td {
text-align: center;
width: 20%;
}
</style>
</head>

<body>
<table border="1" width="100%">
<tr>
<td colspan="5" style="width: 50%;">breit</td><td colspan="5" style="width: 50%;">breit</td>
</tr>
<tr>
<td colspan="2">schmal</td><td colspan="2">schmal</td><td colspan="2">schmal</td><td colspan="2">schmal</td><td colspan="2">schmal</td>
</tr>
<tr>
<td colspan="2">schmal</td><td colspan="2">schmal</td><td colspan="2">schmal</td><td colspan="2">schmal</td><td colspan="2">schmal</td>
</tr>
</table>

</body>
</html>

keksi77 · 15.11.2005, 14:12

Ich glaube ich habe mich etwas unglücklich ausgedrückt.
Das Ergebnis sollte wie im Anhang aussehen.

Danke
Horst

Preacher · 15.11.2005, 14:56

da gibst halt an, dass die 3 zellen in der ersten zeile rechts keinen rahmen haben sollen

keksi77 · 16.11.2005, 07:11

Das ist schon klar das ich dann den Border auf 0 stellen muss, nur <td> hat keine Eigenschaft border nur <tr> hat diese Eigenschaft.
Habe es mit css probiert, nur dann war zwar zwischen den Zellen die Linie weg, nur die Hauptumrandung der Tabelle war immer noch da.

Bitte um Hilfe

Danke
Horst

Preacher · 16.11.2005, 08:39

<html>
<head>

<style>
td {
border: solid;
text-align: center;
}
</style>

</head>

<body>

<table style="width:100%">
<tr>
<td>
1
</td>
<td>
2
</td>
<td colspan="3" style="border-right: none; border-top: none;">
leer
</td>
</tr>
<tr>
<td>1</td><td>2</td><td>3</td><td>4</td><td>5</td>
</tr>
<tr>
<td>1</td><td>2</td><td>3</td><td>4</td><td>5</td>
</tr>
</table>
</body>
</html>

15.11.2005, 11:22	#1
keksi77 Veteran Registriert seit: 20.05.2003 Beiträge: 282	Problem bei Design von HTML Tabelle Hallo, Ich kenne mich zwar nicht so schlecht bei HTML und CSS aus, komme aber bei diesem Problem nicht weiter. Brauche eine Tabelle mit drei Zeilen aber jetzt kommts Erste Zeile sollte nur 2 Spalten haben und die restlichen zwei Zeilen je 5 Spalten zu je 20% Breite. Wie mache ich jetzt diese Tabelle das in der ersten Zeile nur zwei Spalten sind und diese aber genau über den anderen Spalten auf den anderen Zeilen liegen? Wer kann mir helfen? Danke Horst

15.11.2005, 12:38	#2
Schappenberg Tux Fan Registriert seit: 02.03.2004 Beiträge: 860 Mein Computer	Ich glaub du brauchst "colspan" und "rowspan" wenn ich dich richtig verstanden hab. Näheres siehe Selfhtml ____________________________________ Nur tote Fische schwimmen flussabwärts

15.11.2005, 13:04	#3
bully Speedtouchfreak Registriert seit: 07.04.2004 Beiträge: 1.852 Mein Computer	Entweder du bastelst zwei Tabellen, oder du nimmst colspan wie oben von Schappenberg beschrieben, allerdings solltest dann eine gerade Anzahl an Spalten darunter haben, colspan versteht nur ganze Zahlen. (jeweils zwei = 4 Spalten darunter oder jeweils 3, sechs Spalten darunter) lg bully ____________________________________ Freunde nehmen dich so wie du bist. Freunde verzeihen dir deine Schwächen. Freunde sind treu. Freunde freuen sich dich zu sehen. Mein Hund ist mein Freund. Meine Homepage

15.11.2005, 13:40	#4
Preacher Inventar Registriert seit: 20.10.2003 Ort: Celovec / Klagenfurt Alter: 48 Beiträge: 2.559 Mein Computer	Kleiner Workaround: <html> <head> <style> td { text-align: center; width: 20%; } </style> </head> <body> <table border="1" width="100%"> <tr> <td colspan="5" style="width: 50%;">breit</td><td colspan="5" style="width: 50%;">breit</td> </tr> <tr> <td colspan="2">schmal</td><td colspan="2">schmal</td><td colspan="2">schmal</td><td colspan="2">schmal</td><td colspan="2">schmal</td> </tr> <tr> <td colspan="2">schmal</td><td colspan="2">schmal</td><td colspan="2">schmal</td><td colspan="2">schmal</td><td colspan="2">schmal</td> </tr> </table> </body> </html> ____________________________________ Bei Problemen zwei Griffe ranschweißen und aus dem Fenster .....

15.11.2005, 14:56	#6
Preacher Inventar Registriert seit: 20.10.2003 Ort: Celovec / Klagenfurt Alter: 48 Beiträge: 2.559 Mein Computer	da gibst halt an, dass die 3 zellen in der ersten zeile rechts keinen rahmen haben sollen ____________________________________ Bei Problemen zwei Griffe ranschweißen und aus dem Fenster .....

15.11.2005, 14:12	#5
keksi77 Veteran Registriert seit: 20.05.2003 Beiträge: 282	Ich glaube ich habe mich etwas unglücklich ausgedrückt. Das Ergebnis sollte wie im Anhang aussehen. Danke Horst

16.11.2005, 07:11	#7
keksi77 Veteran Registriert seit: 20.05.2003 Beiträge: 282	Das ist schon klar das ich dann den Border auf 0 stellen muss, nur <td> hat keine Eigenschaft border nur <tr> hat diese Eigenschaft. Habe es mit css probiert, nur dann war zwar zwischen den Zellen die Linie weg, nur die Hauptumrandung der Tabelle war immer noch da. Bitte um Hilfe Danke Horst

16.11.2005, 08:39	#8
Preacher Inventar Registriert seit: 20.10.2003 Ort: Celovec / Klagenfurt Alter: 48 Beiträge: 2.559 Mein Computer	<html> <head> <style> td { border: solid; text-align: center; } </style> </head> <body> <table style="width:100%"> <tr> <td> 1 </td> <td> 2 </td> <td colspan="3" style="border-right: none; border-top: none;"> leer </td> </tr> <tr> <td>1</td><td>2</td><td>3</td><td>4</td><td>5</td> </tr> <tr> <td>1</td><td>2</td><td>3</td><td>4</td><td>5</td> </tr> </table> </body> </html> ____________________________________ Bei Problemen zwei Griffe ranschweißen und aus dem Fenster .....

Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)