Book HomeCascading Style Sheets: The Definitive GuideSearch this book Friday 20th of April 2018 04:41:08 PM

10.9. Summary

CSS2 obviously covers a lot of ground, and exploring it in detail would probably have added at least four more chapters to this book, not to mention dramatically bulking up some of the chapters that already exist. However, since so little of CSS2 has actually been implemented at this writing, we felt it was better to provide an overview that was light on details. After all, the specification may change as implementations reveal flaws, and we'd rather stick to describing things that are fairly reliable.

For quick reference purposes, Table 10-1 gives a quick summary of everything new in CSS2.

Table 10-1. New Properties in CSS2

New Properties in CSS2

text-shadow
font-size-
adjust
font-stretch
unicode-bidi
cursor
outline
outline-color
outline-style
outline-width
content
quotes
counter-reset
counter-increment
marker-offset
border-top-color
border-right-color
border-bottom-color
border-left-color
border-top-style
border-right-style
border-bottom-style
border-left-style
position
direction
top
right
bottom
left
z-index
min-width
max-width
min-height
max-height
overflow
clip
visibility
page-break-before
page-break-after
page-break-inside
orphans
widows
size
marks
border-collapse
border-spacing
table-layout
succeeding elements. Navigator 4.x, however, will display theelements with the usual blank line between them, as you can see inFigure 7-26. This is because it's adding thezero values to its own default margins.

Figure 7-26

Figure 7-26. Navigator 4.x and margins

If you want to overcome this space, you can always use negativemargins. Here's one possible declaration:

H1 {margin-bottom: 0;}
border-spacing
empty-cells
caption-side
speak-header-cell
volume
speak
pause-before
pause-after
pause
cue-before
cue-after
cue
play-during
azimuth
elevation
speech-rate
voice-family
pitch
pitch-range
stress
richness
speak-punctuation
speak-rate
speak-numeral
speak-time

New Pseudo-Classes and Pseudo-Elements in CSS2

:hover
:left
:right
:first
:before
:after

New @-rules in CSS2

@media
@font-face
@page

Table 10-2. New Values in CSS2

All Properties

inherit

The display Property

run-in
compact
marker
table
inline-table
table-row-group
table-column-group
table-header-group
table-footer-group
table-row
table-cell
table-caption 

The font Property

caption
icon
menu
message-box
small-caption
status-bar

The list-style-type Property

decimal-leading-zero
hebrew
georgian
armenian
cjk-ideographic
hiragana
katakana
hiragana-iroha
katakana-iroha
lower-greek

The color values

active-border
active-caption
app-workspace
background
button-face
button-highlight
button-text
caption-text
gray-text
highlight
highlight-text
inactive-border
inactive-caption
info-background
info-text
menu
menu-text
scrollbar
three-d-dark-shadow
three-d-face
three-d-highlight
three-d-lightshadow
three-d-shadow
window
window-frame
window-text

The vertical-align Property

length 


Library Navigation Links

Copyright © 2002 O'Reilly & Associates. All rights reserved.

floated elements, we use the value both. This value prevents coexistence with floated elements on both sides of the element, as shown in Figure 7-76:

H2 {clear: both;}
Figure 7-76

Figure 7-76. Clear on both sides

If, on the other hand, we're only worried about H2 elements flowing past floated elements to their right, then we'd use H2 {clear: right;}, with the result shown in
Figure 7-77.
Figure 7-77

Figure 7-77. Clear to the right

Finally, there's clear: none, which allows elements to float to either

Inherited

yes

Applies to

all elements

property border-style defined in CSS1, includingthe default value of none. They are demonstratedin
Figure 7-29.

Figure 7-29

Figure 7-29. Border styles

TIP

The most interesting border style is double.It's defined such that the width of the two lines, plus thewidth of the space between them, is equal to the value ofborder-width (discussed in the next section).can be several lines long withoutany problem whatsoever. */

It's important to remember that CSS comments cannot be nested.So, for example, this would not be correct:

/* This is a comment, in which we findanother comment, which is WRONG/* Another comment */and back to the first comment */

However, it's hardly ever desirable to nest comments, so this