A.1 Visual Media

This is a shorthand method to express all of the individual background properties within a single declaration. Use of this property is generally encouraged over the individual properties as it has a slightly better support profile in older browsers and doesn't take as long to type.

Values:

[ <background-color> || <background-image> || <background-repeat> || <background-attachment> || <background-position> ] | inherit

Initial value:

refer to individual properties

Applies to:

all elements

Inherited:

no

Percentages:

values are allowed for <background-position>

Computed value:

see individual properties

This property defines whether the background image scrolls along with the element when the document is scrolled. This can be used to create "aligned" backgrounds; see Chapter 9 for more details.

Values:

scroll | fixed | inherit

Initial value:

scroll

Applies to:

all elements

Inherited:

no

Computed value:

as specified

This sets a solid color for the background of the element. This color fills the content, padding, and border areas of the element, extending to the outer edge of the element's border. Borders that have transparent sections, such as dashed borders, will show the background through the transparent sections.

Values:

<color> | transparent | inherit

Initial value:

transparent

Applies to:

all elements

Inherited:

no

Computed value:

as specified

Places an image in the background of the element. Depending on the value of background-repeat, the image may tile infinitely, along one axis, or not at all. The initial background image (the origin image) is placed according to the value of background-position.

Values:

<uri> | none | inherit

Initial value:

none

Applies to:

all elements

Inherited:

no

Computed value:

absolute URI

This property sets the position of the background's origin image (as defined by background-image); this is the point from which any background repetition will occur.

Values:

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

Initial value:

0% 0%

Applies to:

block-level and replaced elements

Inherited:

no

Percentages:

refer to the corresponding point on both the element and the origin image

Computed value:

the absolute length offsets, if <length> is specified; otherwise, percentage values

This defines the tiling pattern for the background image. Note that the axis-related repeat values actually cause repetition in both directions along the relevant axis. The repetition begins from the origin image, which is defined the value of background-image and is placed according to the value of background-position.

Values:

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

Initial value:

no-repeat

Applies to:

all elements

Inherited:

no

Computed value:

as specified

This is a shorthand property that defines the width, color, and style of an element's border. Note that while none of the values are actually required, omitting a border style will result in no border being applied because the default border style is none.

Values:

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

Initial value:

refer to individual properties

Applies to:

all elements

Inherited:

no

Computed value:

as specified

This shorthand property defines the width, color, and style of the bottom border of an element. As with border, omission of a border style will result in no border appearing.

Values:

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

Initial value:

not defined for shorthand properties

Applies to:

all elements

Inherited:

no

Computed value:

see individual properties (border-width, etc.)

This property sets the color for the visible portions of the bottom border of an element. Only a solid color can be defined, and the border's style must be something other than none or hidden for any visible border to appear.

Values:

<color> | transparent | inherit

Initial value:

the value of color for the element

Applies to:

all elements

Inherited:

no

Computed value:

if no value is specified, use the computed value of the property color for the same element; otherwise, as specified

This defines the style for the bottom border of an element. The value must be something other than none for any border to appear. In CSS1, HTML user agents were only required to support solid and none.

Values:

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

Initial value:

none

Applies to:

all elements

Inherited:

no

Computed value:

as specified

This sets the width for the bottom border of an element, which will take effect only if the border's style is something other than none. If the border style is none, then the border width is effectively reset to 0. Negative length values are not permitted.

Values:

thin | medium | thick | <length> | inherit

Initial value:

medium

Applies to:

all elements

Inherited:

no

Computed value:

absolute length; 0 if the style of the border is none or hidden

This shorthand property sets the color for the visible portions of the overall border of an element or sets a different color for each of the four sides. Remember that a border's style must be something other than none or hidden for any visible border to appear.

Values:

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

Initial value:

not defined for shorthand properties

Applies to:

all elements

Inherited:

no

Computed value:

see individual properties (border-top-color, etc.)

This shorthand property defines the width, color, and style of the left border of an element. As with border, omission of a border style will result in no border appearing.

Values:

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

Initial value:

not defined for shorthand properties

Applies to:

all elements

Inherited:

no

Computed value:

see individual properties (border-width, etc.)

This property sets the color for the visible portions of the left border of an element. Only a solid color can be defined, and the border's style must be something other than none or hidden for any visible border to appear.

Values:

<color> | transparent | inherit

Initial value:

the value of color for the element

Applies to:

all elements

Inherited:

no

Computed value:

if no value is specified, use the computed value of the property color for the same element; otherwise, as specified

This defines the style for the left border of an element. The value must be something other than none for any border to appear. In CSS1, HTML user agents were only required to support solid and none.

Values:

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

Initial value:

none

Applies to:

all elements

Inherited:

no

Computed value:

as specified

This sets the width for the left border of an element, which will take effect only if the border's style is something other than none. If the border style is none, then the border width is effectively reset to 0. Negative length values are not permitted.

Values:

thin | medium | thick | <length> | inherit

Initial value:

medium

Applies to:

all elements

Inherited:

no

Computed value:

absolute length; 0 if the style of the border is none or hidden

This shorthand property defines the width, color, and style of the right border of an element. As with border, omission of a border style will result in no border appearing.

Values:

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

Initial value:

not defined for shorthand properties

Applies to:

all elements

Inherited:

no

Computed value:

see individual properties (border-width, etc.)

This property sets the color for the visible portions of the right border of an element. Only a solid color can be defined, and the border's style must be something other than none or hidden for any visible border to appear.

Values:

<color> | transparent | inherit

Initial value:

the value of color for the element

Applies to:

all elements

Inherited:

no

Computed value:

if no value is specified, use the computed value of the property color for the same element; otherwise, as specified

This defines the style for the right border of an element. The value must be something other than none for any border to appear. In CSS1, HTML user agents were only required to support solid and none.

Values:

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

Initial value:

none

Applies to:

all elements

Inherited:

no

Computed value:

as specified

This sets the width for the right border of an element, which will only take effect if the border's style is something other than none. If the border style is none, then the border width is effectively reset to 0. Negative length values are not permitted.

Values:

thin | medium | thick | <length> | inherit

Initial value:

medium

Applies to:

all elements

Inherited:

no

Computed value:

absolute length; 0 if the style of the border is none or hidden

This shorthand property can be used to set the styles for the overall border of an element, or for each side individually. The value of any border must be something other than none for the border to appear. In CSS1, HTML user agents were only required to support solid and none.

Values:

[ none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset ]{1,4} | inherit

Initial value:

not defined for shorthand properties

Applies to:

all elements

Inherited:

no

Computed value:

see individual properties (border-top-style, etc.)

Note:

HTML user agents are only required to support solid and none; the rest of the values (except for hidden) may be interpreted as solid

This shorthand property defines the width, color, and style of the top border of an element. As with border, omission of a border style will result in no border appearing.

Values:

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

Initial value:

not defined for shorthand properties

Applies to:

all elements

Inherited:

no

Computed value:

see individual properties (border-width, etc.)

This property sets the color for the visible portions of the top border of an element. Only a solid color can be defined, and the border's style must be something other than none or hidden for any visible border to appear.

Values:

<color> | transparent | inherit

Initial value:

the value of color for the element

Applies to:

all elements

Inherited:

no

Computed value:

if no value is specified, use the computed value of the property color for the same element; otherwise, as specified

This defines the style for the top border of an element. The value must be something other than none for any border to appear. In CSS1, HTML user agents were only required to support solid and none.

Values:

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

Initial value:

none

Applies to:

all elements

Inherited:

no

Computed value:

as specified

This sets the width for the top border of an element, which will only take effect if the border's style is something other than none. If the style is none, then the width is effectively reset to 0. Negative length values are not permitted.

Values:

thin | medium | thick | <length> | inherit

Initial value:

medium

Applies to:

all elements

Inherited:

no

Computed value:

absolute length; 0 if the style of the border is none or hidden

This shorthand property can be used to set the width for the overall border of an element or for each side individually. The width will take effect for a given border only if the border's style is something other than none. If the border style is none, then the border width is effectively reset to 0. Negative length values are not permitted.

Values:

[ thin | medium | thick | <length> ]{1,4} | inherit

Initial value:

not defined for shorthand properties

Applies to:

all elements

Inherited:

no

Computed value:

see individual properties (border-top-style, etc.)

This property defines the offset between the bottom outer margin edge of a positioned element and the bottom edge of its containing block.

Values:

<length> | <percentage> | auto | inherit

Initial value:

auto

Applies to:

positioned elements (that is, elements for which the value of position is something other than static)

Inherited:

no

Percentages:

refer to the height of the containing block

Computed value:

for relatively positioned elements, see note; for static elements, auto; for length values, the corresponding absolute length; for percentage values, the specified value; otherwise, auto

Note:

for relatively positioned elements, if both bottom and top are auto, their computed values are both 0; if one of them is auto, it becomes the negative of the other; if neither is auto, bottom will become the negative of the value of top

This defines the sides of an element on which no floating elements may appear. In CSS1 and CSS2, this is accomplished by automatically increasing the top margin of the cleared element. In CSS2.1, clearance space is added above the element's top margin, but the margin itself is not altered. In either case, the end result is that the element's top outer border edge is just below the bottom outer margin edge of a floated element on the declared side.

Values:

left | right | both | none

Initial value:

none

Applies to:

block-level elements

Inherited:

no

Computed value:

as specified

This is used to define a clipping rectangle inside of which the content of an absolutely positioned element is visible. Content outside this clipping area is treated according to the value of overflow. The clipping area can be smaller or larger than the content area of the element.

Values:

rect(top, right, bottom, left) | auto | inherit

Initial value:

auto

Applies to:

absolutely positioned elements (in CSS2, clip applied to block-level and replaced elements)

Inherited:

no

Computed value:

for a rectangle, a set of four computed lengths representing the edges of the clipping rectangle; otherwise, as specified

This property sets the foreground color of an element, which in HTML rendering means the text of an element; raster images are not affected by color. This is also the color applied to any borders of the element, unless overridden by border-color or one of the other border color properties (border-top-color, etc.).

Values:

<color> | inherit

Initial value:

user agent-specific

Applies to:

all elements

Inherited:

yes

Computed value:

as specified

This is the property used to define the generated content placed before or after an element. By default, this is likely to be inline content, but the type of box the content creates can be controlled using the property display.

Values:

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

Initial value:

normal

Applies to:

:before and :after pseudo-elements

Inherited:

no

Computed value:

for <uri> values, an absolute URI; for attribute references, the resulting string; otherwise, as specified

With this property, counters can be incremented (or decremented) by any value, positive or negative. If no <integer> is supplied, it defaults to 1.

Values:

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

Initial value:

user agent-dependent

Applies to:

all elements

Inherited:

no

Computed value:

as specified

With this property, counters can be reset (or set for the first time) to any value, positive or negative. If no <integer> is supplied, it defaults to 0.

Values:

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

Initial value:

user agent-dependent

Applies to:

all elements

Inherited:

no

Computed value:

as specified

This defines the cursor shape to be used when a mouse pointer is placed within the boundary of an element (although CSS2.1 does not define which edge creates this boundary).

Values:

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

Initial value:

auto

Applies to:

all elements

Inherited:

yes

Computed value:

for <uri> values, an absolute URI; otherwise, as specified

This property specifies the base writing direction of blocks and the direction of embeddings and overrides for the Unicode bidirectional algorithm. User agents that do not support bidirectional text are permitted to ignore this property.

Values:

ltr | rtl | inherit

Initial value:

ltr

Applies to:

all elements

Inherited:

yes

Computed value:

as specified

This is used to define the kind of display box an element generates during layout. Gratuitous use of display with a document type such as HTML can be dangerous, as it upsets the display hierarchy already defined in HTML. In the case of XML, which has no such built-in hierarchy, display is indispensable.

Values:

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

Initial value:

inline

Applies to:

all elements

Inherited:

no

Computed value:

varies for floated, positioned, and root elements (see CSS2.1, section 9.7); otherwise, as specified

Note:

the values compact and marker appeared in CSS2 but were dropped from CSS2.1 due to a lack of widespread support

This defines the direction in which an element is floated. This has traditionally been applied to images in order to let text flow around them, but in CSS, any element may be floated. A floated element will generate a block-level box no matter what kind of element it may be. Floated nonreplaced elements should be given an explicit width, as they may otherwise tend to become as narrow as possible.

Values:

left | right | none | inherit

Initial value:

none

Applies to:

all elements

Inherited:

no

Computed value:

as specified

This is a shorthand property used to set two or more aspects of an element's font all at once. It can also be used to set the element's font to match an aspect of the user's computing environment using keywords such as icon. Note that if these keywords are not used, the minimum font value must include the font size and family.

Values:

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

Initial value:

refer to individual properties

Applies to:

all elements

Inherited:

yes

Percentages:

calculated with respect to the parent element for <font-size> and with respect to the element's <font-size> for <line-height>

Computed value:

see individual properties (font-style, etc.)

This defines a font family to be used in the display of an element's text. Note that use of a specific font family (e.g., Geneva) is wholly dependent on that family being available on a user's machine; no font downloading is implied by this property. Therefore, the use of generic family names as a last fallback is strongly encouraged.

Values:

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

Initial value:

user agent-specific

Applies to:

all elements

Inherited:

yes

Computed value:

as specified

This sets the size of the font for an element. Note that this actually sets the height of the character boxes in the font; the actual character glyphs may be taller or shorter than these boxes (usually shorter). Each keyword must be larger than the next lowest keyword and smaller than the next biggest keyword. Negative length and percentage values are not permitted.

Values:

xx-small | x-small | small | medium | large | x-large | xx-large | smaller | larger | <length> | <percentage> | inherit

Initial value:

medium

Applies to:

all elements

Inherited:

yes

Percentages:

calculated with respect to the parent element's font size

Computed value:

an absolute length

This sets the font to use an italic, oblique, or normal font face. Italic text is generally defined as a separate face within the font family. It is theoretically possible for a user agent to compute a slanted font face from the normal face.

Values:

italic | oblique | normal | inherit

Initial value:

normal

Applies to:

all elements

Inherited:

yes

Computed value:

as specified

This property is basically used to define small-caps text. It is theoretically possible for a user agent to compute a small-caps font face from the normal face.

Values:

small-caps | normal | inherit

Initial value:

normal

Applies to:

all elements

Inherited:

yes

Computed value:

as specified

This property sets the font weight used in rendering an element's text. The numeric value 400 is equivalent to the keyword normal, and 700 is equivalent to bold. Each numeric value must be at least as light as the next lowest number and at least as heavy as the next highest number.

Values:

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

Initial value:

normal

Applies to:

all elements

Inherited:

yes

Computed value:

one of the numeric values (100, etc.), or one of the numeric values plus one of the relative values (bolder or lighter)

This defines the height of an element's content area, outside of which padding, borders, and margins are added. This property is ignored for inline nonreplaced elements. Negative length and percentage values are not permitted.

Values:

<length> | <percentage> | auto | inherit

Initial value:

auto

Applies to:

block-level and replaced elements

Inherited:

no

Percentages:

calculated with respect to the height of the containing block

Computed value:

for auto and percentage values, as specified; otherwise, an absolute length, unless the property does not apply to the element (then auto)

This property defines the offset between the left outer margin edge of a positioned element and the left edge of its containing block.

Values:

<length> | <percentage> | auto | inherit

Initial value:

auto

Applies to:

positioned elements (that is, elements for which the value of position is something other than static)

Inherited:

no

Percentages:

refer to the width of the containing block

Computed value:

for relatively positioned elements, see note; for static elements, auto; for length values, the corresponding absolute length; for percentage values, the specified value; otherwise, auto

Note:

for relatively positioned elements, the computed value of left always equals right

This defines the amount of whitespace to be inserted between the character boxes of text. Since character glyphs are typically narrower than their character boxes, length values create a modifier to the usual spacing between letters. Thus, normal is synonymous with 0. Negative length values are permitted and will cause letters to bunch closer together.

Values:

<length> | normal | inherit

Initial value:

normal

Applies to:

all elements

Inherited:

yes

Computed value:

for length values, the absolute length; otherwise, normal

This property influences the layout of line boxes. When applied to a block-level element, it defines the minimum distance between baselines within that element, but not the maximum. The difference between the computed values of line-height and font-size (called "leading" in CSS) is split in half and added to the top and bottom of each piece of content in a line of text. The shortest box that can enclose all those pieces of content is the line box. A raw number value assigns a scaling factor, which is inherited instead of a computed value. Negative values are not permitted.

Values:

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

Initial value:

normal

Applies to:

all elements (but see text regarding replaced and block-level elements)

Inherited:

yes

Percentages:

relative to the font size of the element

Computed value:

for length and percentage values, the absolute value; otherwise, as specified

This is a shorthand property that condenses all the other list-style properties. As it applies to any element that has a display of list-item, it will apply only to li elements in ordinary HTML and XHTML, although it can be applied to any element and inherited by list-item elements.

Values:

[ <list-style-type> || <list-style-image> || <list-style-position> ] | inherit

Initial value:

refer to individual properties

Applies to:

elements whose display value is list-item

Inherited:

yes

Computed value:

see individual properties

This specifies an image to be used as the marker on an ordered or unordered list item. The placement of the image with respect to the content of the list item can be broadly controlled using list-style-position.

Values:

<uri> | none | inherit

Initial value:

none

Applies to:

elements whose display value is list-item

Inherited:

yes

Computed value:s:

for <uri> values, the absolute URI; otherwise, none

This property is used to declare the position of the list marker with respect to the content of the list item. Outside markers are placed some distance from the border edge of the list item, but the distance is not defined in CSS. Inside markers are treated as though they were an inline element inserted at the beginning of the list item's content.

Values:

inside | outside | inherit

Initial value:

outside

Applies to:

elements whose display value is list-item

Inherited:

yes

Computed value:

as specified

This is used to declare the type of marker system to be used in the presentation of a list.

CSS2.1values:

disc | circle | square | decimal | decimal-leading-zero | upper-alpha | lower-alpha | upper-roman | lower-roman | none | inherit

CSS2 values:

disc | circle | square | decimal | decimal-leading-zero | upper-alpha | lower-alpha | upper-roman | lower-roman | lower-greek | hebrew | armenian | georgian | cjk-ideographic | hiragana | katakana | hiragana-iroha | none | inherit

Initial value:

disc

Applies to:

elements whose display value is list-item

Inherited:

yes

Computed value:

as specified

This shorthand property sets the width of the overall margin for an element or sets the widths of each individual side margin. Vertically adjacent margins of block-level elements are collapsed, whereas inline elements effectively do not take top and bottom margins. The left and right margins of inline elements do not collapse, nor do margins on floated elements. Negative margin values are permitted, but caution is warranted.

Values:

[ <length> | <percentage> | auto ]{1,4} | inherit

Initial value:

not defined

Applies to:

all elements

Inherited:

no

Percentages:

refer to the width of the containing block

Computed value:

see individual properties

This sets the width of the bottom margin for an element. Negative values are permitted, but caution is warranted.

Values:

<length> | <percentage> | auto | inherit

Initial value:

0

Applies to:

all elements

Inherited:

no

Percentages:

refer to the width of the containing block

Computed value:

for percentages, as specified; for length values, the absolute length

This sets the width of the left margin for an element. Negative values are permitted, but caution is warranted.

Values:

<length> | <percentage> | auto | inherit

Initial value:

0

Applies to:

all elements

Inherited:

no

Percentages:

refer to the width of the containing block

Computed value:

for percentages, as specified; for length values, the absolute length

This sets the width of the right margin for an element. Negative values are permitted, but caution is warranted.

Values:

<length> | <percentage> | auto | inherit

Initial value:

0

Applies to:

all elements

Inherited:

no

Percentages:

refer to the width of the containing block

Computed value:

for percentages, as specified; for length values, the absolute length

This sets the width of the top margin for an element. Negative values are permitted, but caution is warranted.

Values:

<length> | <percentage> | auto | inherit

Initial value:

0

Applies to:

all elements

Inherited:

no

Percentages:

refer to the width of the containing block

Computed value:

for percentages, as specified; for length values, the absolute length

The value of this property sets a maximum constraint on the height of the element. Thus, the element can be shorter than the specified value, but not taller. Negative values are not permitted.

Values:

<length> | <percentage> | none | inherit

Initial value:

none

Applies to:

all elements except inline nonreplaced elements and table elements

Inherited:

no

Percentages:

refer to the height of the containing block

Computed value:

for percentages, as specified; for length values, the absolute length; otherwise, none

The value of this property sets a maximum constraint on the width of the element. Thus, the element can be narrower than the specified value, but not wider. Negative values are not permitted.

Values:

<length> | <percentage> | none | inherit

Initial value:

none

Applies to:

all elements except inline nonreplaced elements and table elements

Inherited:

no

Percentages:

refer to the height of the containing block

Computed value:

for percentages, as specified; for length values, the absolute length; otherwise, none

The value of this property sets a minimum constraint on the height of the element. Thus, the element can be taller than the specified value, but not shorter. Negative values are not permitted.

Values:

<length> | <percentage> | inherit

Initial value:

0

Applies to:

all elements except inline nonreplaced elements and table elements

Inherited:

no

Percentages:

refer to the width of the containing block

Computed value:

for percentages, as specified; for length values, the absolute length

The value of this property sets a minimum constraint on the width of the element. Thus, the element can be wider than the specified value, but not narrower. Negative values are not permitted.

Values:

<length> | <percentage> | inherit

Initial value:

0

Applies to:

all elements except inline nonreplaced elements and table elements

Inherited:

no

Percentages:

refer to the width of the containing block

Computed value:

for percentages, as specified; for length values, the absolute length; otherwise, none

This shorthand property is used to set the overall outline for an element. Outlines can be of irregular shape, and they do not change or otherwise affect the placement of elements.

Values:

[ <outline-color> || <outline-style> || <outline-width> ] | inherit

Initial value:

not defined for shorthand properties

Applies to:

all elements

Inherited:

no

Computed value:

see individual properties (outline-color, etc.)

This property sets the color for the visible portions of the overall outline of an element. Remember that an outline's style must be something other than none for any visible border to appear.

Values:

<color> | invert | inherit

Initial value:

invert (or user agent-specific; see text)

Applies to:

all elements

Inherited:

no

Computed value:

as specified

This property is used to set the style for the overall border of an element. The style must be something other than none for any outline to appear.

Values:

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

Initial value:

none

Applies to:

all elements

Inherited:

no

Computed value:

as specified

This property sets the width for the overall outline of an element. The width will take effect only for a given outline if the outline's style is something other than none. If the style is none, then the width is effectively reset to 0. Negative length values are not permitted.

Values:

thin | medium | thick | <length> | inherit

Initial value:

medium

Applies to:

all elements

Inherited:

no

Computed value:

absolute length; 0 if the style of the border is none or hidden

This defines what happens to content that overflows the content area of an element. For the value scroll, user agents are supposed to provide a scrolling mechanism whether or not it is actually needed; thus, for example, scrollbars would appear even if all content is able to fit within the element box.

Values:

visible | hidden | scroll | auto | inherit

Initial value:

visible

Applies to:

block-level and replaced elements

Inherited:

no

Computed value:

as specified

This shorthand property sets the width of the overall padding for an element or sets the widths of each individual side padding. Padding set on inline nonreplaced elements does not affect line-height calculations; therefore, such an element with both padding and a background may visibly extend into other lines and potentially overlap other content. The background of the element will extend throughout the padding. Negative padding values are not permitted.

Values:

[ <length> | <percentage> ]{1,4} | inherit

Initial value:

not defined for shorthand elements

Applies to:

all elements

Inherited:

no

Percentages:

refer to the width of the containing block

Computed value:

see individual properties (padding-top, etc.)

Note:

padding can never be negative

This property sets the width of the bottom padding for an element. Bottom padding set on inline nonreplaced elements does not affect line-height calculations; therefore, such an element with both bottom padding and a background may visibly extend into other lines and potentially overlap other content. Negative padding values are not permitted.

Values:

<length> | <percentage> | inherit

Initial value:

0

Applies to:

all elements

Inherited:

no

Percentages:

refer to the width of the containing block

Computed value:

for percentage values, as specified; for length values, the absolute length

Note:

padding can never be negative

This property sets the width of the left padding for an element. Left padding set for an inline nonreplaced element will appear only on the left edge of the first inline box generated by the element. Negative padding values are not permitted.

Values:

<length> | <percentage> | inherit

Initial value:

0

Applies to:

all elements

Inherited:

no

Percentages:

refer to the width of the containing block

Computed value:

for percentage values, as specified; for length values, the absolute length

Note:

padding can never be negative

This property sets the width of the right padding for an element. Right padding set for an inline nonreplaced element will appear only on the right edge of the last inline box generated by the element. Negative padding values are not permitted.

Values:

<length> | <percentage> | inherit

Initial value:

0

Applies to:

all elements

Inherited:

no

Percentages:

refer to the width of the containing block

Computed value:

for percentage values, as specified; for length values, the absolute length

Note:

padding can never be negative

This property sets the width of the top padding for an element. Top padding set on inline nonreplaced elements does not affect line-height calculations; therefore, such an element with both top padding and a background may visibly extend into other lines and potentially overlap other content. Negative padding values are not permitted.

Values:

<length> | <percentage> | inherit

Initial value:

0

Applies to:

all elements

Inherited:

no

Percentages:

refer to the width of the containing block

Computed value:

for percentage values, as specified; for length values, the absolute length

Note:

padding can never be negative

This defines the positioning scheme used to lay out an element. Any element may be positioned, although elements positioned with absolute or fixed will generate a block-level box no matter what kind of element they are. An element that is relatively positioned is offset from its default placement in the normal flow.

Values:

static | relative | absolute | fixed | inherit

Initial value:

static

Applies to:

all elements

Inherited:

no

Computed value:

as specified

This property is used to determine the quotation pattern used with quotes and nested quotes. The actual quote marks are inserted via the property content.

Values:

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

Initial value:

user agent-dependent

Applies to:

all elements

Inherited:

yes

Computed value:

as specified

This property defines the offset between the right outer margin edge of a positioned element and the right edge of its containing block.

Values:

<length> | <percentage> | auto | inherit

Initial value:

auto

Applies to:

positioned elements (that is, elements for which the value of position is something other than static)

Inherited:

no

Percentages:

refer to the width of the containing block

Computed value:

for relatively positioned elements, see note; for static elements, auto; for length values, the corresponding absolute length; for percentage values, the specified value; otherwise, auto

Note:

for relatively positioned elements, the computed value of left always equals right

This property sets the horizontal alignment of text within a block-level element by defining the point to which line boxes are aligned. The value justify is supported by allowing user agents to programmatically adjust the letter and word spacing of the line's content; results may vary by user agent.

CSS2.1values:

left | center | right | justify | inherit

CSS2 values:

left | center | right | justify | <string> | inherit

Initial value:

user agent-specific; may also depend on writing direction

Applies to:

block-level elements

Inherited:

yes

Computed value:

as specified

Note:

CSS2 included a <string> value that was dropped from CSS2.1 due to a lack of widespread support

This property allows certain text effects such as underlining. These decorations will "span" descendant elements that do not have decorations of their own. User agents are not required to support blink.

Values:

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

Initial value:

none

Applies to:

all elements

Inherited:

no

Computed value:

as specified

Used to define the indentation of the first line of content in a block-level element. This is most often used to create a "tab" effect. Negative values are permitted and cause "outdent" (or "hanging indent") effects.

Values:

<length> | <percentage> | inherit

Initial value:

0

Applies to:

block-level elements

Inherited:

yes

Percentages:

refer to the width of the containg block

Computed value:

for percentage values, as specified; for length values, the absolute length

This property changes the case of letters in an element, regardless of the case of the text in the document source. The determination of which letters are to be capitalized by the value capitalize is not precisely defined, as it depends on user agents knowing how to recognize a "word."

Values:

uppercase | lowercase | capitalize | none | inherit

Initial value:

none

Applies to:

all elements

Inherited:

yes

Computed value:

as specified

This property defines the offset between the top outer margin edge of a positioned element and the top edge of its containing block.

Values:

<length> | <percentage> | auto | inherit

Initial value:

auto

Applies to:

positioned elements (that is, elements for which the value of position is something other than static)

Inherited:

no

Percentages:

refer to the height of the containing block

Computed value:

for relatively positioned elements, see note; for static elements, auto; for length values, the corresponding absolute length; for percentage values, the specified value; otherwise, auto

Note:

for relatively positioned elements, if both top and bottom are auto, their computed values are both 0; if one of them is auto, it becomes the negative of the other; if neither is auto, bottom will become the negative of the value of top

Allows the author to generate levels of embedding within the Unicode embedding algorithm. User agents that do not support bidirectional text are permitted to ignore this property.

Values:

normal | embed | bidi-override | inherit

Initial value:

normal

Applies to:

all elements

Inherited:

no

Computed value:

as specified

This defines the vertical alignment of an inline element's baseline with respect to the baseline of the line in which it resides. Negative length and percentage values are permitted, and they lower the element instead of raising it. In table cells, this property sets the alignment of the content of the cell within the cell box.

Values:

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

Initial value:

baseline

Applies to:

inline elements and table cells

Inherited:

no

Percentages:

refer to the value of line-height for the element

Computed value:

for percentage and length values, the absolute length; otherwise, as specified

Note:

when applied to table cells, only the values baseline, top, middle, and bottom are recognized

This specifies whether the element box generated by an element is rendered. This means authors can have the element take up the space it would ordinarily take up but be completely invisible. The value collapse is used in tables to remove columns or rows from the table's layout.

Values:

visible | hidden | collapse | inherit

Initial value:

inherit

Applies to:

all elements

Inherited:

no

Computed value:

as specified

This declares how whitespace within an element is handled during layout. The values pre-wrap and pre-line were added in CSS2.1.

Values:

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

Initial value:

normal

Applies to:

all elements (CSS2.1); block-level elements (CSS1 and CSS2)

Inherited:

no

Computed value:

as specified

This defines the width of an element's content area, outside of which padding, borders, and margins are added. This property is ignored for inline nonreplaced elements. Negative length and percentage values are not permitted.

Values:

<length> | <percentage> | auto | inherit

Initial value:

auto

Applies to:

block-level and replaced elements

Inherited:

no

Percentages:

refer to the width of the containing block

Computed value:

for auto and percentage values, as specified; otherwise, an absolute length, unless the property does not apply to the element (then auto)

This defines the amount of whitespace to be inserted between words in an element. For the purposes of this property, a "word" is defined to be a string of characters surrounded by whitespace. Length values create a modifier to the usual spacing between words; thus, normal is synonymous with 0. Negative length values are permitted and will cause words to bunch closer together.

Values:

<length> | normal | inherit

Initial value:

normal

Applies to:

all elements

Inherited:

yes

Computed value:

for normal, the absolute length 0; otherwise, the absolute length

This property sets the placement of a positioned element along the z-axis, which is defined to be the axis that extends perpendicular to the display area. Positive numbers are closer to the user, and negative numbers are further away.

Values:

<integer> | auto | inherit

Initial value:

auto

Applies to:

positioned elements

Inherited:

no

Computed value:

as specified