J'ai 2 float: left div, le premier est fixe et je veux que le second div étire l'espace restant.Stretch droite float div largeur?
<div id="container">
<div id="leftform"> </div>
<div id="rightform"> </div>
</div>
Toute idée? Merci
J'ai 2 float: left div, le premier est fixe et je veux que le second div étire l'espace restant.Stretch droite float div largeur?
<div id="container">
<div id="leftform"> </div>
<div id="rightform"> </div>
</div>
Toute idée? Merci
En CSS2:
#container {display:table; table-layout:fixed;}
#leftform, #rightform {display:table-cell;}
#leftform {width:100px;}
Dans le monde de l'IE hacks:
#container {padding-left:100px;}
#leftform {float:left; width:100px; margin-left:-100px;}
utiliser une fonction javascript pour faire à la fois la même hauteur.
//fixing column height problem using Prototype
Event.observe(window,"load",function(){
if(parseInt($('leftform').getStyle('height')) > parseInt($('rightform').getStyle('height')))
$('rightform').setStyle({'height' : parseInt($('leftform').getStyle('height'))+'px'});
else
$('leftform').setStyle({'height' : parseInt($('rightform').getStyle('height'))+'px'});
});//observe
même problème here.
La version de hacks IE est la manière habituelle de le faire sur n'importe quel navigateur. L'utilisation de 'table-cell' directement dans 'table' sans 'table-row' n'est pas définie même si la table supportée par le navigateur affiche des valeurs. – bobince
@bobince: vous avez tort. CSS nécessite la génération automatique d'éléments de table anonymes manquants. Il est spécifié et fonctionne de manière fiable: http://www.w3.org/TR/CSS21/tables.html#anonymous-boxes – Kornel