• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Height für DIV in TD

F

freezly

Neues Mitglied
Hallo Community,

ich habe eine Tabelle in der pro Zelle ein div Container (für einen Rahmen) drin ist. Jede Zelle hat unterschiedlich viel Inhalt. Nun sind deswegen die DIVs unterschiedlich hoch. Ich habe es bereits mit height: 100% versucht. Klappt aber nicht. Was mache ich verkehrt?

Hier mal mein gekürztes Beispiel, was das Problem recht gut zeigt:
HTML: 
<!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">	<head>		<style type="text/css">		<!--
		.container {			outline-width: thin;			outline-color: #CCCCCC;			outline-style: solid;						margin: 10px;			padding: 10px;			height: 100%;			border-top-left-radius: 3px;			border-top-right-radius: 3px;			border-bottom-right-radius: 3px;			border-bottom-left-radius: 3px;		}				td{			vertical-align: top;			width: 200px;		}		-->		</style>	</head>	<body>			<table>			<tbody>				<tr>					<td>						<div class="container">TEXT</div>					</td>					<td>						<div class="container">TEXT <br /> TEXT <br /></div>					</td>					<td>						<div class="container">TEXT <br /> TEXT <br />TEXT <br /> TEXT <br />TEXT <br /> TEXT <br /></div>					</td>				</tr>			</tbody>		</table>	</body></html>
 
threadi schrieb:
Sind das wirklich tabellarische Daten die Du da darstellen willst?
Zum Vergrößern anklicken....

Ja ... ist ein datagrid von Primefaces: PrimeFaces - ShowCase
Im Beispiel habe ich nur eine Zeile dargestellt, weil es als Beispiel reicht. In Wirklichkeit können es mehrere Zeilen sein. Außerdem sehe ich grad, dass der Quelltext falsch dargestellt wird. Hier noch mal ordentlich:
HTML: 
<!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">	<head>		<style type="text/css">		<!--		.container {			outline-width: thin;			outline-color: #CCCCCC;			outline-style: solid;						margin: 10px;			padding: 10px;			height: 100%;			border-top-left-radius: 3px;			border-top-right-radius: 3px;			border-bottom-right-radius: 3px;			border-bottom-left-radius: 3px;		}				td{			vertical-align: top;			width: 200px;		}		-->		</style>	</head>	<body>			<table>			<tbody>				<tr>					<td>						<div class="container">TEXT</div>					</td>					<td>						<div class="container">TEXT <br /> TEXT <br /></div>					</td>					<td>						<div class="container">TEXT <br /> TEXT <br />TEXT <br /> TEXT <br />TEXT <br /> TEXT <br /></div>					</td>				</tr>			</tbody>		</table>	</body> </html>


Übrigens hat mich dieses Forum gestern geärgert und hat mir meinen Thread nicht erstellt, was er wohl offensichtlich später doch getan hat. Ich habe in einem anderen Forum das Problem auch gepostet. Falls da ein Thema schon angesprochen wurde, dann kann man sich hier die Antwort sparen. Sorry dafür. DIV gleiche Höhe in jeder Zelle
 
So, jetzt möchte ich noch ein letztes mal versuchen den Quelltext sauber zu posten:
HTML: 
<!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">	<head>		<style type="text/css">		<!--		.container {			outline-width: thin;			outline-color: #CCCCCC;			outline-style: solid;						margin: 10px;			padding: 10px;			height: 100%;			border-top-left-radius: 3px;			border-top-right-radius: 3px;			border-bottom-right-radius: 3px;			border-bottom-left-radius: 3px;		}				td{			vertical-align: top;			width: 200px;		}		-->		</style>	</head>	<body>			<table>			<tbody>				<tr>					<td>						<div class="container">TEXT</div>					</td>					<td>						<div class="container">TEXT <br /> TEXT <br /></div>					</td>					<td>						<div class="container">TEXT <br /> TEXT <br />TEXT <br /> TEXT <br />TEXT <br /> TEXT <br /></div>					</td>				</tr>			</tbody>		</table>	</body></html>

Was gibt es für Alternativen?
 
Tabellarische Inhalte gehören in Tabellen - ja. Nur gehören dort eigentlich keine anderen Dinge rein. Wozu soll das <div> dort dienen?

Btw. sind Crossposting verpönt ..
 
threadi schrieb:
Btw. sind Crossposting verpönt ..
Zum Vergrößern anklicken....

Ich weiß, und ich hoffe ich konnte erklären, wie es dazu gekommen ist. Ich bin jetzt nicht böse, wenn mir doch noch jemand hier einen guten Tipp geben kann, aber wegen mir können wir das Thema hier schließen ... ich werde im anderen Forum weiter posten. Ich habe nur keinen "Close" knopf gefunden. :?::?::?:
 
freezly schrieb:
.....Nun sind deswegen die DIVs unterschiedlich hoch. Ich habe es bereits mit height: 100% versucht. Klappt aber nicht. Was mache ich verkehrt?
Zum Vergrößern anklicken....

Verstehe ich dich richtig, dass du alle Zeilen gleich hoch haben möchtest?
Soll sich die Höhe am grössten Container orientieren oder was genau ist dein Vorhaben.

Ins Blaue geschossen:
Du kannst eine fixe Grösse oder eine maximale Grösse zuordnen und mit overflow:auto; den Bereich scrollbar machen.

Bsp:
HTML: 
<div style="overflow:auto; max-height:200px; margin-left:20px; padding:10px;">
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben