list-style-position Attribute | listStylePosition Property

Sets or retrieves how the list-item marker is drawn relative to the content of the object.

Syntax

HTML { list-style-position: sPosition }

Scripting object.style.listStylePosition [ = sPosition ]

HTML	{ list-style-position: sPosition }
Scripting	object.style.listStylePosition [ = sPosition ]

Possible Values

sPosition String that specifies one of the following values:

outside Marker is placed outside the text, and any wrapping text is not aligned under the marker.

inside Marker is placed inside the text, and any wrapping text is aligned under the marker.

The property is read/write with a default value of outside; the cascading style sheets (CSS) attribute is inherited.
Expressions can be used in place of the preceding value(s), as of Microsoft® Internet Explorer 5. For more information, see Dynamic Properties.

Remarks

This property applies only to objects with a display value of list-item.

If the left margin of a list item is set to 0 using one of the margin properties, the list-item markers do not show. The margin should be set to a minimum of 30 points.

Example

The following examples use the list-style-position attribute and the listStylePosition property to set the position for markers.

This example uses UL and UL.compact as selectors in an embedded (global) style sheet to set the position of the list-item markers.

Sample Code
<STYLE>
    UL{ list-style-position:inside }
    UL.compact { list-style-position:outside }
</STYLE>
</HEAD>
<BODY>
<UL>
    <LI>... 
    <LI>... 
</UL>
<UL CLASS=compact>
    <LI>... 
    <LI>...
</UL>
This feature requires Internet Explorer 4.0 or later. Click the icon below to install the latest version. Then reload this page to view the sample.

This example uses inline scripting to change the marker position when an onmouseover event occurs.
<SPAN STYLE="width:3cm" onmouseover="this.style.listStylePosition='inside'"
    onmouseout="this.style.listStylePosition='outside'">
This feature requires Internet Explorer 4.0 or later. Click the icon below to install the latest version. Then reload this page to view the sample.

Applies To

[ Object Name ]

Platform Version

Win16:

Win32:

Mac:

Unix:

WinCE:

Version data is listed when the mouse hovers over a link, or the link has focus.

currentStyle, LI, OL, runtimeStyle, style, UL