HTML5, CSS3, and JavaScript Fourth Edition

(Ben Green) #1

Chapter 12


Box Model


Contents


12.1 The Basic Box.................... 127
12.1.1 Content........................ 127
12.1.2 Padding........................ 128
12.1.3 Border......................... 129
12.1.4 Margin........................ 129
12.1.5 Outline........................ 130
12.1.6 Rounded Corners: Border-Radius.......... 131
12.2 Best Practices.................... 131
12.3 Clockwise Order: top, right, bottom, left.... 132
12.4 Measurement Units................. 133
12.4.1 Percentages...................... 133
12.4.2 Pixels......................... 133
12.4.3 Absolute Lengths: cm, mm, in, pt, pc....... 134
12.4.4 Font-Relative Lengths: em, ex, ch......... 134
12.4.5 Viewport Percentages: vw, vh, vmin, vmax.... 135
12.5 Box Math: Ultimate Size.............. 136
12.6 Float and Clear................... 136
12.7 For Further Study.................. 137

We often desire a bit of space between the text and pictures that make up
our webpage. And we would like to control that space.


126

Free download pdf