• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

Breitenangabe für div innerhalb td

mikdoe

mikdoe

Moderator
Guten Tag!
Habe hier ein div innerhalb einer td mit horizontal übergroßem Inhalt.
Möchte daher im div overflow:auto angeben damit der Scrollbalken nur im div erscheint und nicht im ganzen Fenster. Das klappt bei mir aber nur mit einer festen Breitenangabe im div. Diese Breite weiß ich aber nicht, weil sie von der ganzen Tabellenbreite abhänigt, die wiederum von der Bildauflösung abhängt.

Wie kann ich im div mit overflow:auto arbeiten ohne die konkrete Breite in Pixeln zu wissen?

Danke Euch
 
Hab es doch mal rausgezogen, ging schneller als gedacht :)
Vielen Dank schonmal für die Hilfe.
HTML: 
<!DOCTYPE HTML>
<html>
<head>
<title>Test</title>
</head>
<body>

<table style="width: 100%; border: thin #EBECED solid; border-collapse: separate;">
	<tr style="background-color: #D0D0D0;">
		<td><b>Testtabelle</b></td>
		<td style="text-align: center;"><b>Status</b></td>
	</tr>
	<tr>
		<td>
			<div style="font-size: smaller;">
				<table cellpadding="0" cellspacing="0">
					<tr><td><img src="../images/trans.gif" height="5"></td></tr>
					<tr>
						<td>Test:</td>
					</tr>
					<tr>
						<td>
<div id="um_dieses_div_geht_es" style="overflow: auto;"><ul>
	<li style="white-space: nowrap;">Dies ist ein extrem lange Zeile für den Test. Dies ist ein extrem lange Zeile für den Test. Dies ist ein extrem lange Zeile für den Test. Dies ist ein extrem lange Zeile für den Test. Dies ist ein extrem lange Zeile für den Test. Dies ist ein extrem lange Zeile für den Test. Dies ist ein extrem lange Zeile für den Test. Dies ist ein extrem lange Zeile für den Test. Dies ist ein extrem lange Zeile für den Test. Dies ist ein extrem lange Zeile für den Test. Dies ist ein extrem lange Zeile für den Test. Dies ist ein extrem lange Zeile für den Test. Dies ist ein extrem lange Zeile für den Test. </li>
	</ul>
</ul>
</div>
						</td>
					</tr>
				</table>
			</div>
		</td>
		<td style="text-align: center;"><img src="../images/trans.gif" width="10"><img src="../images/licht_klein_gruen.gif"><img src="../images/trans.gif" width="10"></td>
	</tr>
</table>

</body>
</html>

Wie gesagt. Wenn ich das div "um_dieses_div_geht_es" mit der width:500px; als Beispiel ausstatte ist alles wie gewünscht. Ich möchte aber den Scrollbalken haben, auch wenn ich keine feste Breite angebe, die Breite soll sich nach der <td> richten, in der sich das div befindet.

Danke
 
dkdenz schrieb:
Dafür brauchst Du dann wohl Javascript.
Zum Vergrößern anklicken....

Hab mal was eingebaut, tut aber nichts, es ändert sich nichts. Firebug zeigt keinen Fehler.
Was mache ich falsch?
HTML: 
<!DOCTYPE HTML>
<html>
<head>
<title>Test</title>
</head>
<body>

<table style="width: 100%; border: thin #EBECED solid; border-collapse: separate;">
	<tr style="background-color: #D0D0D0;">
		<td><b>Testtabelle</b></td>
		<td style="text-align: center;"><b>Status</b></td>
	</tr>
	<tr>
		<td>
			<div style="font-size: smaller;">
				<table cellpadding="0" cellspacing="0">
					<tr><td><img src="../images/trans.gif" height="5"></td></tr>
					<tr>
						<td>Test:</td>
					</tr>
					<tr>
						<td id="elternzelle">
<div id="um_dieses_div_geht_es" style="overflow: auto;"><ul>
	<li style="white-space: nowrap;">Dies ist ein extrem lange Zeile für den Test. Dies ist ein extrem lange Zeile für den Test. Dies ist ein extrem lange Zeile für den Test. Dies ist ein extrem lange Zeile für den Test. Dies ist ein extrem lange Zeile für den Test. Dies ist ein extrem lange Zeile für den Test. Dies ist ein extrem lange Zeile für den Test. Dies ist ein extrem lange Zeile für den Test. Dies ist ein extrem lange Zeile für den Test. Dies ist ein extrem lange Zeile für den Test. Dies ist ein extrem lange Zeile für den Test. Dies ist ein extrem lange Zeile für den Test. Dies ist ein extrem lange Zeile für den Test. </li>
	</ul>
</ul>
</div>
						</td>
					</tr>
				</table>
			</div>
		</td>
		<td style="text-align: center;"><img src="../images/trans.gif" width="10"><img src="../images/licht_klein_gruen.gif"><img src="../images/trans.gif" width="10"></td>
	</tr>
</table>

<script type="text/javascript">
	document.getElementById('um_dieses_div_geht_es').style.width = document.getElementById('elternzelle').offsetWidth;
</script>

</body>
</html>
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben