E-Books for you

23 Consider the following example
markup and CSS:

Text in a narrow column can break.

em {
margin: 0 1em;
padding: 0 1em;
border: 1px solid #000;
}
If margins, padding, and borders are set on that em element, the result may not be
what the author intended if the element??™s box is split into two line boxes as a result
of line wrapping??”Figure 6.11 shows the potential result.
Figure 6.11: A split inline box
As you can see, the margin and padding are applied to the left of the word ???narrow???
and to the right of the word ???column.??? The borders are applied on three sides of
each of the two inline boxes.
If the total width of the inline boxes is less than the width of the line box, the
direction and text-align properties control how the boxes are distributed inside
the line box.
CSS Layout and Formatting
23 CSS3 may provide more control in such cases.
The Ultimate CSS Reference 168
The left and right edges of a line box normally touch the edges of its containing
block.


Pages:
232 233 234 235 236 237 238 239 240 241 242 243 244 245 246 247 248 249 250 251 252 253 254 255 256