CSS2 » Properties » marker-offset

Version: Level 2

Compability: Currently not supported by any browser.

Syntax:
marker-offset : auto | length
length
The length value is the horizontal distance between the two boxes. It can be positive or negative and can be in any of the following seven units. Use the abbreviation.
 
Length Abbrev.
centimeters cm
ems em
inches in
millimeters mm
picas pc
pixels px
points pt
auto
The auto value allows the browser to automatically set the distance.

The marker-offset property specifies the horizontal distance (called the offset) between a marker box and the principal box. This distance is measured between the nearest border edges of the two boxes. This property is not inherited.

One method for displaying a list is to create a principal box and a marker box. An item in the list is displayed in the principal box, while the associated marker box contains a number, image, or decoration such a bullet. This offers the possibility of creating unique list styles. Also, the marker boxes can be used with counters (via the content property).
 
The marker-offset property is used to position the marker box precisely in relation to the prinicipal box. The marker box can occur either inside or outside the principal box, but the position of the marker box does effect the position of the principal box.
 
In contrast, the various CSS list-style properties offer the ability to create simple lists, but lack the potential sophistication of marker/principal boxes.
 

Examples

Code:
<style type="text/css">
li:before
{
 display: marker;
 marker-offset: 5px;
}
</style>
Language(s): CSS2

See Also: