2 3.0 2.0 1.3 2.0 1.5 1.0 7.0 6.0 5.5
None None None None Full Full Full None None None
This is a proprietary Mozilla extension to the CSS standard.
375 Vendor-specific Properties
-moz-box-sizing
-moz-box-sizing: { content-box | border-box |
padding-box } ;
This property can be used to specify the
CSS box model that??™s used to calculate
the widths and heights of elements.
-moz-box-sizing16 is similar to the CSS3
proposal called box-sizing17 but, again,
exhibits differences: the CSS3 proposal
doesn??™t include the value padding-box.
In the following example, we specify
that the border-box box model is to be
used to calculate the dimensions of matching elements, where the padding and
borders will be included within the dimensions, rather than added to them:
Example
This rule will cause the browser to render
the .example element using the
padding-box box sizing model:
.example {
-moz-box-sizing: padding-box;
}
.example {
-moz-box-sizing: border-box;
box-sizing: border-box;
width: 200px;
height: 120px;
padding: 30px;
border: 5px solid #000;
background: #ffffcc;
text-align: center;
}
The results of the CSS above can be seen in Figure 16.
Pages:
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543