M
Ich weiß zwar nicht, ob das Problem noch aktuell ist, aber ich bin gerade auf den Beitrag gestossen (ich schau nicht so oft in dieses Forum) und hatte mir die Frage auch schon des öfteren gestellt. Ich habe dann jetzt mal eine Schnell-Lösung geschrieben. Bisher werden Rahmen-Größen nicht unterstützt, deswegen resize ich beide Spalten, aber wenn jmd. Lust hat, dann könnte er es ja entsprechend anpassen.
Hier mein Test-Code:
<html>
<head>
<title>CSS: Spalten-Layout (gleiche Höhe) - Test</title>
<style>
#frame { padding: 2px; background: #CCC; border: 1px solid #000; }
#left { float: left; width: 100px; padding: 2px; background: #AAA; border: 1px solid #000; }
#right { float: right; width: 100px; padding: 2px; background: #EEE; border: 1px solid #000; }
#spanner { height: 1px; visibility: hidden; clear: both; }
</style>
<script language="javascript">
function arrange(id1, id2) {
el1 = document.getElementById(id1);
el2 = document.getElementById(id2);
if (el1.offsetHeight > el2.offsetHeight) {
el2.style.height = el1.offsetHeight;
el1.style.height = el1.offsetHeight;
}
else {
el1.style.height = el2.offsetHeight;
el2.style.height = el2.offsetHeight;
}
}
</script>
</head>
<body onLoad="arrange('left', 'right');">
<div id="frame">
<div id="left">
<h3>left</h3>
Text<br>Text<br>Text<br>Text<br>Text<br>Text<br>Text<br>
</div>
<div id="right">
<h3>right</h3>
Text<br>Text<br>Text<br>Text<br>Text<br>Text<br>Text<br>
Text<br>Text<br>Text<br>Text<br>Text<br>Text<br>Text<br>
</div>
<div id="spanner"></div>
</div>
</body>
</html>