« Le langage CSS/Le modèle de boîte » : différence entre les versions

Contenu supprimé Contenu ajouté
Aucun résumé des modifications
Ligne 86 :
 
== Taille des boites ==
La propriété <code>box-sizing</code> est apparue en CSS3<ref>http://www.w3.org/TR/css3-ui/#box-sizing</ref> pour simplifier les couches.
{{traduire}}
[http://www.w3.org/TR/css3-ui/#box-sizing Box-sizing] is a CSS3 property to make certain layouts simpler. Box-sizing is supported by WebKit, Gecko and Presto.
 
<code>box-sizing</code> take 1 argument that is any of the following:
* {{CSS:value|<code>content-box}}</code>
*: boxes inside arrange normally.
* {{CSS:value|<code>border-box}}</code>
*: boxes inside arrange around the border.
* {{CSS:value|<code>inherit}}</code>
*: inherit the parent behavior.
 
Ligne 138 ⟶ 137 :
<div style="width: 50%; border: 1em solid; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; border-color: green; float: left;">This should be on the left.</div>
<div style="width: 50%; border: 1em solid; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; border-color: blue; float: left;">This should be on the right.</div>
The two boxes should be above this text side by side if your browser supports {{CSS:property|<code>box-sizing}}</code>.
</div>
 
==Références==
<references/>