2 Tabellen untereinander anordnen HTML CSS?
Ich würde gerne 2 Tabellen untereinander anlegen.Ich habe dies schon mit divs probiert jedoch hat dies nicht so ganz geklappt.Kann mir wer erklären wie ich das machen kann?Danke
2 Antworten
Der Umbruch auf eine neue Zeile entspricht bereits dem Standardverhalten von Tabellen.
<table><!-- table 1 --></table>
<table><!-- table 2 --></table>
Wenn das nicht klappt, wurde dieses Verhalten von dir wohl überschrieben. Schau in dem Fall also, welche Styles auf die Tabellen und den Containern wirken.
Um zwei Tabellen untereinander in HTML und CSS anzuordnen, kannst du diese folgende Schritte befolgen:
Erstellen Sie zwei separate <table>-Elemente für die beiden Tabellen in Ihrem HTML-Code.
Umschließen Sie jede Tabelle mit einem <div>-Element, um sie als Block-Elemente zu behandeln.
Verwenden Sie die CSS-Eigenschaft display: block; für die umschließenden <div>-Elemente, um sicherzustellen, dass sie untereinander angeordnet werden.
Hier ist ein Beispiel-Code:
<div style="display: block;">
<table>
<!-- Erste Tabelle -->
<tr>
<th>Spalte 1</th>
<th>Spalte 2</th>
</tr>
<tr>
<td>Zelle 1</td>
<td>Zelle 2</td>
</tr>
</table>
</div>
<div style="display: block;">
<table>
<!-- Zweite Tabelle -->
<tr>
<th>Spalte 1</th>
<th>Spalte 2</th>
<th>Spalte 3</th>
</tr>
<tr>
<td>Zelle 1</td>
<td>Zelle 2</td>
<td>Zelle 3</td>
</tr>
</table>
</div>
ich hoffe es hat geholfen mfg expusia
Hey ich mache css und html immer separat.Wie würde das dann aussehen ?
das problem ist ich weiß leider nicht wie du es gemacht hast also ist es echt schwer dir zuhelfen und für die css ist es (ist nur ein bespiel wie gesagt weiß leider nicht wie den code aussieht)
table {
width: 100%;
border-collapse: collapse;
margin-bottom: 20px;
}
th, td {
padding: 8px;
text-align: left;
border-bottom: 1px solid #ddd;
}
th {
background-color: #f2f2f2;
}
Ich habe das jedoch ausprobiert,jedoch ist meine Kopfzeile verschwunden und die Tabelle ist total schmal geworden.Ausserdem haben sich die Rahenb komplett verschoben