Verschachtelte Table automatisch horizontal scrollbar

[Rene J.]

Hallo liebe Selfhtml-Forengemeinde!

Ich hoffe ihr könnt mir in einem Anliegen weiterhelfen, bei dem ich nicht so recht weiter weiß. Hintergrund ist folgender: Auf einem System, welches automatisch HTML Seiten generiert wird eine Tabelle ausgegeben. Die Struktur dieser Seite ist vorgegeben und kann leider nicht von mir geändert werden. Das einzige worauf ich Zugriff habe, ist die CSS Datei für diese Seite.

Nun möchte ich gern, dass diese Tabelle automatisch auf Geräten mit kleiner Bildschirmbreite horizontal scrollbar wird. Also der Fließtext drumherum passt seine Breite ja automatisch an, aber die Tabelle soll dann nicht dafür sorgen, dass der gesamte Seiteninhalt nach rechts scrollbar wird. Ich hoffe diese Aussage ist verständlich.

Mit einer normalen Tabelle funktioniert das ja auch folgende Weise (ggf. eingebunden mit Media-Query): .table3 { overflow-x: auto; display: block; }

Wenn ich das aber in den vorhandenen Aufbau einbaue, dann funktioniert das nicht mehr. Die Struktur ist folgende:

<table class="table1" style="width:100%">
	<tbody>
		<tr>
			<td>
			<table class="table2" style="width:100%">
				<tbody>
					<tr>
						<td>Heading Text</td>
					</tr>
					<tr>
						<table class="table3" width="100%">
							<tbody>
								<tr><th></th><th></th><th></th></tr>
										..............
								<tr><td></td><td></td><td></td></tr>
							</tbody>
						</table>
					</tr>
					<tr>
						<td>Footer Text</td>
					</tr>
				</tbody>
			</table>
			</td>
		</tr>
	</tbody>
</table>

Mein Ziel ist also, dass table3 horizontal srollbar wird und die übergeordneten Tabellen maximal Bildschirmbreite haben. Leider sprengt die table3 immer die Bildschirmbreite.

Jemand eine Idee wie sich das lösen lässt? Vielen Dank bereits im Voraus!

Rene

[MrMurphy1]

Hallo,

der Validator zeigt bei deinem Quelltext mehrere Fehler an. Bevor die nicht behoben sind macht es keinen Sinn sich mit dem Layout zu beschäftigen.

Gruss

MrMurphy

[MrMurphy1]

Hallo,

und fülle die Tabelle bitte mit Zellen und Inhalt. So ist ja von der Tabelle nichts zu sehen wenn man sich die Mühe macht und aus deinem Quellcodeschnipsel selbst eine Seite erstellt.

Gruss

MrMurphy

[Gunnar Bittersmann]

@@MrMurphy1

und fülle die Tabelle bitte mit Zellen und Inhalt. So ist ja von der Tabelle nichts zu sehen

Und mit Inhalt ist dann auch zu sehen, ob table hier überhaupt sinnvoll verwendet wird oder ob es sich um Layoutgestelle handelt.

LLAP 🖖