CSS 2.1 Properties and Proprietary Extensions: Appendix B - CSS Cookbook, Third Edition

'background-attachment'

scroll | fixed | inherit

scroll

'background-color'

<color> | transparent | inherit

transparent

'background-image'

<uri> | none | inherit

none

'background-position'

[ [ <percentage> | <length> | left | center | right ] [ <percentage> | <length> | top | center | bottom ]? ] | [ [ left | center | right ] || [ top | center | bottom ] ] | inherit

0%

'background-repeat'

repeat | repeat-x | repeat-y | no-repeat | inherit

repeat

'background'

[ 'background-color' || 'background-image' || 'background-repeat' || 'background-attachment' || 'background-position'] | inherit

See individual properties

'border-collapse'

collapse | separate | inherit

separate

'table' and 'inline-table'elements

'border-color'

[ <color> | transparent ]{1,4} | inherit

See individual properties

'border-spacing'

<length> <length>? | inherit

0

'table' and 'inline-table'elements

'border-style'

<border-style>{1,4} | inherit

See individual properties

'border-top'

'border-right'

'border-bottom'

'border-left'

[ <border-width> || <border-style> || >'border-top-color' ] | inherit

See individual properties

'border-top-color'

'border-right-color'

'border-bottom-color'

'border-left-color'

<color> | transparent | inherit

The value of the 'color' property

'border-top-style'

'border-right-style'

'border-bottom-style'

'border-left-style'

<border-style> | inherit

none

'border-top-width'

'border-right-width'

'border-bottom-width'

'border-left-width'

<border-width> | inherit

medium

'border-width'

<border-width>{1,4} | inherit

See individual properties

'border'

[ <border-width> || <border-style> || >'border-top-color' ] | inherit

See individual properties

'bottom'

<length> | <percentage> | auto | inherit

auto

Positioned elements

'caption-side'

top | bottom | inherit

top

'table-caption' elements

'clear'

none | left | right | both | inherit

none

Block-level elements

'clip'

<shape> | auto | inherit

auto

Absolutely positioned elements

'color'

<color> | inherit

Depends on user agent

'content'

normal | none | [ <string> | <uri> | <counter> | attr( <identifier>) | open-quote | close-quote | no-open-quote | no-close-quote ]+ | inherit

normal

:before and :afterpseudo-elements

'counter-increment'

[ <identifier> <integer>? ]+ | none | inherit

none

'counter-reset'

[ <identifier> <integer>? ]+ | none | inherit

none

'cursor'

[ [ <uri> ,]* [ auto | crosshair | default | pointer | move | e-resize | ne-resize | nw-resize | n-resize | se-resize | sw-resize | s-resize | w-resize | text | wait | help | progress ] ] | inherit

auto

'direction'

ltr | rtl | inherit

ltr

All elements, but see prose

'display'

inline | block | list-item | run-in | inline-block | table | inline-table | table-row-group | table-header-group | table-footer-group | table-row | table-column-group | table-column | table-cell | table-caption | none | inherit

inline

'empty-cells'

show | hide | inherit

show

'table-cell' elements

'float'

left | right | none | inherit

none

All

'font-family'

[[ <family-name> | <generic-family> ] [, <family-name>| <generic-family>]* ] | inherit

Depends on user agent

'font-size'

<absolute-size> | <relative-size> | <length> | <percentage> | inherit

medium

'font-style'

normal | italic | oblique | inherit

normal

'font-variant'

normal | small-caps | inherit

normal

'font-weight'

normal | bold | bolder | lighter | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 | inherit

normal

'font'

[ [ 'font-style' || 'font-variant' || 'font-weight' ]? 'font-size' [ / 'line-height' ]? 'font-family' ] | caption | icon | menu | message-box | small-caption | status-bar | inherit

See individual properties

'height'

<length> | <percentage> | auto | inherit

auto

All elements except nonreplaced inline elements, table columns, and column groups

'left'

<length> | <percentage> | auto | inherit

auto

Positioned elements

'letter-spacing'

normal | <length> | inherit

normal

'line-height'

normal | <number> | <length> | <percentage> | inherit

normal

'list-style-image'

<uri> | none | inherit

none

Elements with 'display: list-item'

'list-style-position'

inside | outside | inherit

outside

Elements with 'display: list-item'

'list-style-type'

disc | circle | square | decimal | decimal-leading-zero | lower-roman | upper-roman | lower-greek | lower-latin | upper-latin | armenian | georgian | lower-alpha | upper-alpha | none | inherit

disc

Elements with 'display: list-item'

'list-style'

[ 'list-style-type' || 'list-style-position' || 'list-style-image' ] | inherit

See individual properties

Elements with 'display: list-item'

'margin-right'

'margin-left'

<margin-width> | inherit

0

All elements except elements with table display types other than table and inline-table

'margin-top'

'margin-bottom'

<margin-width> | inherit

0

All elements except elements with table display types other than table and inline-table

'margin'

<margin-width>{1,4} | inherit

See individual properties

All elements except elements with table display types other than table and inline-table

'max-height'

<length> | <percentage> | none | inherit

none

All elements except nonreplaced inline elements, table columns, and column groups

'max-width'

<length> | <percentage> | none | inherit

none

All elements except nonreplaced inline elements, table rows, and row groups

'min-height'

<length> | <percentage> | inherit

0

All elements except nonreplaced inline elements, table columns, and column groups

'min-width'

<length> | <percentage> | inherit

0

All elements except nonreplaced inline elements, table rows, and row groups

'orphans'

<integer> | inherit

2

Block-level elements

'outline-color'

<color> | invert | inherit

invert

'outline-style'

<border-style> | inherit

none

'outline-width'

<border-width> | inherit

medium

'outline'

[ 'outline-color' || 'outline-style' || 'outline-width' ] | inherit

See individual properties

'overflow'

visible | hidden | scroll | auto | inherit

visible

Nonreplaced block-level elements, table cells, and inline-block elements

'padding-top'

'padding-right'

'padding-bottom'

'padding-left'

<padding-width> | inherit

0

All elements except elements with table display types other than table, inline-table, and table-cell

'padding'

<padding-width>{1,4} | inherit

See individual properties

All elements except elements with table display types other than table, inline-table, and table-cell

'page-break-after'

auto | always | avoid | left | right | inherit

auto

Block-level elements

'page-break-before'

auto | always | avoid | left | right | inherit

auto

Block-level elements

'page-break-inside'

avoid | auto | inherit

auto

Block-level elements

'position'

static | relative | absolute | fixed | inherit

static

'quotes'

[ <string> <string>]+ | none | inherit

Depends on user agent

'right'

<length> | <percentage> | auto | inherit

auto

Positioned elements

'table-layout'

auto | fixed | inherit

auto

'table' and 'inline-table'elements

'text-align'

left | right | center | justify | inherit

'left' if 'direction' is 'ltr'; 'right' if 'direction' is 'rtl'

Block-level elements, table cells, and inline blocks

'text-decoration'

none | [ underline || overline || line-through || blink ] | inherit

none

'text-indent'

<length> | <percentage> | inherit

0

Block-level elements, table cells, and inline blocks

'text-transform'

capitalize | uppercase | lowercase | none | inherit

none

'top'

<length> | <percentage> | auto | inherit

auto

Positioned elements

'unicode-bidi'

normal | embed | bidi-override | inherit

normal

All elements, but see prose

'vertical-align'

baseline | sub | super | top | text-top | middle | bottom | text-bottom | <percentage> | <length> | inherit

baseline

inline-level and 'table-cell'elements

'visibility'

visible | hidden | collapse | inherit

visible

'white-space'

normal | pre | nowrap | pre-wrap | pre-line | inherit

normal

'widows'

<integer> | inherit

2

Block-level elements

'width'

<length> | <percentage> | auto | inherit

auto

All elements except nonreplaced inline elements, table rows, and row groups

'word-spacing'

normal | <length> | inherit

normal

'z-index'

auto | <integer> | inherit

auto

Positioned elements

'background-attachment'

scroll | fixed | inherit

No

Visual

'background-color'

<color> | transparent | inherit

No

Visual

'background-image'

<uri> | none | inherit

No

Visual

'background-position'

[ [ <percentage> | <length> | left | center | right ] [ <percentage> | <length> | top | center | bottom ]? ] | [ [ left | center | right ] || [ top | center | bottom ] ] | inherit

No

Refer to the size of the box itself

Visual

'background-repeat'

repeat | repeat-x | repeat-y | no-repeat | inherit

No

Visual

'background'

[ 'background-color' || 'background-image' || 'background-repeat' || 'background-attachment' || 'background-position'] | inherit

No

Allowed on 'background-position'

Visual

'border-collapse'

collapse | separate | inherit

Yes

Visual

'border-color'

[ <color> | transparent ]{1,4} | inherit

No

Visual

'border-spacing'

<length> <length>? | inherit

Yes

Visual

'border-style'

<border-style>{1,4} | inherit

No

Visual

'border-top'

'border-right'

'border-bottom'

'border-left'

[ <border-width> || <border-style> || >'border-top-color' ] | inherit

No

Visual

'border-top-color'

'border-right-color'

'border-bottom-color'

'border-left-color'

<color> | transparent | inherit

No

Visual

'border-top-style'

'border-right-style'

'border-bottom-style'

'border-left-style'

<border-style> | inherit

No

Visual

'border-top-width'

'border-right-width'

'border-bottom-width'

'border-left-width'

<border-width> | inherit

No

Visual

'border-width'

<border-width>{1,4} | inherit

No

Visual

'border'

[ <border-width> || <border-style> || >'border-top-color' ] | inherit

No

Visual

'bottom'

<length> | <percentage> | auto | inherit

No

Refer to height of containing block

Visual

'caption-side'

top | bottom | inherit

Yes

Visual

'clear'

none | left | right | both | inherit

No

Visual

'clip'

<shape> | auto | inherit

No

Visual

'color'

<color> | inherit

Yes

Visual

'content'

normal | none | [ <string> | <uri> | <counter> | attr( <identifier>) | open-quote | close-quote | no-open-quote | no-close-quote ]+ | inherit

No

All

'counter-increment'

[ <identifier> <integer>? ]+ | none | inherit

No

All

'counter-reset'

[ <identifier> <integer>? ]+ | none | inherit

No

All

'cursor'

[ [ <uri> ,]* [ auto | crosshair | default | pointer | move | e-resize | ne-resize | nw-resize | n-resize | se-resize | sw-resize | s-resize | w-resize | text | wait | help | progress ] ] | inherit

Yes

Visual, interactive

'direction'

ltr | rtl | inherit

Yes

Visual

'display'

inline | block | list-item | run-in | inline-block | table | inline-table | table-row-group | table-header-group | table-footer-group | table-row | table-column-group | table-column | table-cell | table-caption | none | inherit

No

All

'empty-cells'

show | hide | inherit

Yes

Visual

'float'

left | right | none | inherit

No

Visual

'font-family'

[[ <family-name> | <generic-family> ] [, <family-name>| <generic-family>]* ] | inherit

Yes

Visual

'font-size'

<absolute-size> | <relative-size> | <length> | <percentage> | inherit

Yes

Refer to parent element’s font size

Visual

'font-style'

normal | italic | oblique | inherit

Yes

Visual

'font-variant'

normal | small-caps | inherit

Yes

Visual

'font-weight'

normal | bold | bolder | lighter | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 | inherit

Yes

Visual

'font'

[ [ 'font-style' || 'font-variant' || 'font-weight' ]? 'font-size' [ / 'line-height' ]? 'font-family' ] | caption | icon | menu | message-box | small-caption | status-bar | inherit

Yes

See individual properties

Visual

'height'

<length> | <percentage> | auto | inherit

No

See prose

Visual

'left'

<length> | <percentage> | auto | inherit

No

Refer to width of containing block

Visual

'letter-spacing'

normal | <length> | inherit

Yes

Visual

'line-height'

normal | <number> | <length> | <percentage> | inherit

Yes

Refer to font size of element itself

Visual

'list-style-image'

<uri> | none | inherit

Yes

Visual

'list-style-position'

inside | outside | inherit

Yes

Visual

'list-style-type'

disc | circle | square | decimal | decimal-leading-zero | lower-roman | upper-roman | lower-greek | lower-latin | upper-latin | armenian | georgian | lower-alpha | upper-alpha | none | inherit

Yes

Visual

'list-style'

[ 'list-style-type' || 'list-style-position' || 'list-style-image' ] | inherit

Yes

Visual

'margin-right'

'margin-left'

<margin-width> | inherit

No

Refer to width of containing block

Visual

'margin-top'

'margin-bottom'

<margin-width> | inherit

No

Refer to width of containing block

Visual

'margin'

<margin-width>{1,4} | inherit

No

Refer to width of containing block

Visual

'max-height'

<length> | <percentage> | none | inherit

No

See prose

Visual

'max-width'

<length> | <percentage> | none | inherit

No

Refer to width of containing block

Visual

'min-height'

<length> | <percentage> | inherit

No

See prose

Visual

'min-width'

<length> | <percentage> | inherit

No

Refer to width of containing block

Visual

'orphans'

<integer> | inherit

Yes

Visual, paged

'outline-color'

<color> | invert | inherit

No

Visual, interactive

'outline-style'

<border-style> | inherit

No

Visual, interactive

'outline-width'

<border-width> | inherit

No

Visual, interactive

'outline'

[ 'outline-color' || 'outline-style' || 'outline-width' ] | inherit

No

Visual, interactive

'overflow'

visible | hidden | scroll | auto | inherit

No

Visual

'padding-top'

'padding-right'

'padding-bottom'

'padding-left'

<padding-width> | inherit

No

Refer to width of containing block

Visual

'padding'

<padding-width>{1,4} | inherit

No

Refer to width of containing block

Visual

'page-break-after'

auto | always | avoid | left | right | inherit

No

Visual, paged

'page-break-before'

auto | always | avoid | left | right | inherit

No

Visual, paged

'page-break-inside'

avoid | auto | inherit

Yes

Visual, paged

'position'

static | relative | absolute | fixed | inherit

No

Visual

'quotes'

[ <string> <string>]+ | none | inherit

Yes

Visual

'right'

<length> | <percentage> | auto | inherit

No

Refer to width of containing block

Visual

'table-layout'

auto | fixed | inherit

No

Visual

'text-align'

left | right | center | justify | inherit

Yes

Visual

'text-decoration'

none | [ underline || overline || line-through || blink ] | inherit

No (see prose)

Visual

'text-indent'

<length> | <percentage> | inherit

Yes

Refer to width of containing block

Visual

'text-transform'

capitalize | uppercase | lowercase | none | inherit

Yes

Visual

'top'

<length> | <percentage> | auto | inherit

no

Refer to height of containing block

Visual

'unicode-bidi'

normal | embed | bidi-override | inherit

No

Visual

'vertical-align'

baseline | sub | super | top | text-top | middle | bottom | text-bottom | <percentage> | <length> | inherit

No

Refer to 'line-height' of the element itself

Visual

'visibility'

visible | hidden | collapse | inherit

Yes

Visual

'white-space'

normal | pre | nowrap | pre-wrap | pre-line | inherit

Yes

Visual

'widows'

<integer> | inherit

Yes

Visual, paged

'width'

<length> | <percentage> | auto | inherit

No

Refer to width of containing block

Visual

'word-spacing'

normal | <length> | inherit

Yes

Visual

'z-index'

auto | <integer> | inherit

No

Visual

'filter'

See http://tr.im/filterproperty

N/A

No

Filter properties

'overflow-x'

visible | scroll | hidden | auto

visible (except for textarea, then initial value is hidden)

No

Visual

'overflow-y'

visible | scroll | hidden | auto

visible (except for textarea, then initial value is auto)

Visual

'scrollbar-3dlight-color'

<color>

Default color

Element with scroll bar

Yes

Visual

'scrollbar-arrow-color'

<color>

Default color

Element with scroll bar

Yes

Visual

'scrollbar-base-color'

<color>

Default color

Element with scroll bar

Yes

Visual

'scrollbar-darkshadow-color'

<color>

Default color

Element with scroll bar

Yes

Visual

'scrollbar-face-color'

<color>

Default color

Element with scroll bar

Yes

Visual

'scrollbar-highlight-color'

<color>

Default color

Element with scroll bar

Yes

Visual

'scrollbar-shadow-color'

<color>

Default color

Element with scroll bar

Yes

Visual

'zoom'

normal | <number> | <percentage>

normal

No

Yes

Visual

'background-position-x'

<length> | <percentage> | left | center | right

0%

No

Yes

Visual

'background-position-y'

<length> | <percentage> | top | center | bottom

0%

No

Yes

Visual

'ime-mode'

auto | active |inactive | disabled

auto

Yes

Visual

'layout-grid'

mode | type | line | char

both loose none none

Yes

Visual

'layout-grid-char'

<length> | <percentage> | none | auto

none

No

Yes

Visual

'layout-grid-line'

<length> | <percentage> | none | auto

none

No

Yes

Visual

'layout-grid-mode'

both | none | line | char

both

Yes

Visual

'layout-grid-type'

loose | strict | fixed

loose

Yes

Visual

'line-break'

normal | strict

normal

Yes

Visual

'text-autospace'

none | ideograph-alpha | ideograph-numeric | ideograph-parenthesis | ideograph-space

none

No

Visual

'text-justify'

auto | distribute | distribute-all-lines | distribute-center-last | inter-cluster | inter-ideograph | inter-word | kashida | newspaper

auto

Yes

Visual

'text-kashida-space'

<percentage> | inherit

0%

Yes

Visual

'text-underline-position'

above | below | auto | auto-pos

auto

Yes

visual

'word-break'

normal | break-all | keep-all

normal

Yes

Visual

'word-wrap'

normal | break-word

normal

Yes

Visual

'writing-mode'

lr-tb | tb-rl

lr-tb

No

Visual

'-moz-appearance'

none | button | button-small | checkbox | checkbox-container | checkbox-small | dialog | listbox | menu | menuitem | menulist | menulist-button | menulist-textfield| progressbar | radio | radio-container | radio-small | resizer| scrollbar | scrollbarbutton-down | scrollbarbutton-left | scrollbarbutton-right | scrollbarbutton-up | scrollbartrack-horizontal | scrollbartrack-vertical | separator | statusbar | tab | tab-left-edge | tabpanels | textfield | toolbar | toolbarbutton | toolbox | tooltip | treeheadercell | treeheadersortarrow | treeitem | treetwisty | treetwistyopen | treeview | window

none

No

'-moz-binding'

uri | none

none

No

'-moz-background-clip'

border | padding

border

No

'-moz-background-inline-policy'

bounding-box | continuous | each-box

continuous

Inline elements

No

'-moz-background-origin'

border | padding | content

padding

No

'-moz-background-image'

[ <uri> | none] | [number | <percentage>]

[ stretch | repeat | round ]

none | <image>

[ <number> | <percentage> ]

[ <border-width> ]

[ stretch | repeat | round ]

none

No

'-moz-border-bottom-colors'

'-moz-border-left-colors'

'-moz-border-right-colors'

'-moz-border-top-colors'

<color> | transparent

N/A

No

'-moz-border-radius'

<length> | <percentage>

0

No

'-moz-border-radius-bottomleft'

'-moz-border-radius-bottomright'

'-moz-border-radius-topleft'

'-moz-border-radius-topright'

<length> | <percentage>

0

No

'-moz-box-align'

start | center | end | baseline | stretch

stretch

Elements with a CSS display value of -moz-box or -moz-inline-box

No

'-moz-box-direction'

normal | reverse

normal

Elements with a CSS display value of -moz-box or -moz-inline-box

No

'-moz-box-flex'

0 | >0

0

Elements with a CSS display value of -moz-box or -moz-inline-box

No

'-moz-box-orient'

horizontal | vertical

horizontal

Elements with a CSS display value of -moz-box or -moz-inline-box

No

'-moz-box-pack'

start | center | end | justify

start

Elements with a CSS display value of -moz-box or -moz-inline-box

No

'-moz-box-shadow'

none | [ <color> <length> <length> <length> <length> | <length> <length> <length> <length>? <color> ] | inherit

none

No

'-moz-box-sizing'

content-box | border-box | padding box

content-box

No

'-moz-image-region'

For rect() values, a rect consisting of four computed lengths

auto

XUL image elements and :-moz-tree-image, :-moz-tree-twisty, and :-moz-tree-checkbox pseudo-elements

Yes

'-moz-opacity'

0 (or less) | 0<number<1 | 1 (or more)

1

No

'-moz-outline'

-moz-outline-color | -moz-outline-style | -moz-outline-width

See individual properties

No

'-moz-outline-color'

<color> | invert

invert

No

'-moz-outline-offset'

<number>

0

No

'-moz-outline-radius'

<length> | <percentage>

0

No

'-moz-outline-radius-bottomleft'

'-moz-outline-radius-bottomright'

'-moz-outline-radius-topleft'

'-moz-outline-radius-topright'

<length> | <percentage>

0

No

'-moz-outline-style'

none | dotted | dashed | solid | double | groove | ridge | inset | outset

none

No

'-moz-outline-width'

<width>

medium

No

'-moz-user-focus'

ignore | normal

'-moz-outline-input'

none | enabled | disabled | inherit

none

Yes

'-moz-outline-select'

none | text | -moz-none

No

'-moz-window-shadow'

default | none

default

All elements that make native windows; e.g., window, panel

No