Re: td et height
Bonjour,
>> A la suite de modifications dynamiques de contenus dans des cellules de
>> tableau, j'aimerais avoir des infos sur la nouvelle taille de la ligne de
>> cellules concernée.
> Et je repose la question : Pour quoi faire ?
Pour présenter un ensemble de textes sous deux colonnes (ou en
multi-colonnes...).
Chacun de ces textes se présente sous la forme d'une succession de
paragraphes qui ne doivent pas être scindés.
La colonne de gauche doit être plus grande que la colonne de droite, mais la
plus petite possible.
Après une première moulinette, les 2 colonnes arrivent à peu près
équilibrées en longueur.
Mais je me pose la question de fignoler, lorsque c'est possible, en faisant
fonctionner quelques lignes en javascript.
Merci pour les informations qui me permettent d'abourir à une solution
possible (ci-dessous).
Thomas Huguet
<html>
<head>
<style type="text/css">
div { margin-bottom:5px; }
</style>
<script>
function go()
{
alert("Avant !");
while (document.getElementById('Col2').offsetHeight >
document.getElementById('Col1').offsetHeight)
{
var child = document.getElementById('Col2').firstChild;
if ( child.nodeName == "DIV" )
document.getElementById('Col1').appendChild(child) ;
else
document.getElementById('Col2').removeChild(child) ;
}
alert("Après !");
}
</script>
</head>
<body onLoad="go();">
<table>
<tr>
<td width="400" style="background-color:lightsalmon;
vertical-align:top;">
<div id ="Col1"></div>
</td>
<td width="400" style="background-color:lightyellow;
vertical-align:top;">
<div id ="Col2">
<div>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
Sed non risus.</div>
<div>Suspendisse lectus tortor, dignissim sit amet, adipiscing
nec, ultricies sed, dolor. Cras elementum ultrices diam. Maecenas ligula
massa, varius a, semper congue, euismod non,
mi. Proin porttitor, orci nec nonummy molestie, enim est eleifend mi, non
fermentum diam nisl sit amet erat.</div>
<div>Duis semper. Duis arcu massa, scelerisque vitae, consequat
in, pretium a, enim.</div>
<div>Pellentesque congue. Ut in risus volutpat libero pharetra
tempor. Cras vestibulum bibendum augue. Praesent egestas leo in pede.
Praesent blandit odio eu enim. Pellentesque
sed dui ut augue blandit sodales.</div>
<div>Vestibulum ante ipsum primis in faucibus orci luctus et
ultrices posuere cubilia Curae; Aliquam nibh. Mauris ac mauris sed pede
pellentesque fermentum. Maecenas adipiscing
ante non diam sodales hendrerit.</div>
<div>Ut velit mauris, egestas sed, gravida nec, ornare ut, mi.
Aenean ut orci vel massa suscipit pulvinar. Nulla sollicitudin. Fusce
varius, ligula non tempus aliquam, nunc turpis
ullamcorper nibh, in tempus sapien eros vitae ligula. Pellentesque rhoncus
nunc et augue. Integer id felis. Curabitur aliquet pellentesque diam.
Integer quis metus vitae elit lobortis egestas.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</div>
<div>Morbi vel erat non mauris convallis vehicula. Nulla et
sapien.</div>
<div>Integer tortor tellus, aliquam faucibus, convallis id,
congue eu, quam. Mauris ullamcorper felis vitae erat. Proin feugiat, augue
non elementum posuere, metus purus iaculis lectus,
et tristique ligula justo vitae magna. Aliquam convallis sollicitudin
purus.</div>
<div>Praesent aliquam, enim at fermentum mollis, ligula massa
adipiscing nisl, ac euismod nibh nisl eu lectus. Fusce vulputate sem at
sapien. Vivamus leo. Aliquam euismod libero eu
enim. Nulla nec felis sed leo placerat imperdiet.</div>
<div>Aenean suscipit nulla in justo. Suspendisse cursus rutrum
augue. Nulla tincidunt tincidunt mi. Curabitur iaculis, lorem vel rhoncus
faucibus, felis magna fermentum augue, et
ultricies lacus lorem varius purus. Curabitur eu amet.</div>
</div>
</td>
</tr>
</table>
</body>
</html>
|