list-style-position Attribute | listStylePosition Property
Gets or sets a variable that indicates how the list-item marker is drawn relative to the content of the object.
Syntax
CSS { list-style-position : sPosition } Scripting [ sPosition = ] object.style.listStylePosition
Possible Values
sPosition String that specifies or receives one of the following values.
- outside
- Default. 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 for all objects except the following, for which it is read-only: currentStyle. The property has a default value of outside. The Cascading Style Sheets (CSS) attribute is inherited.
DHTML expressions can be used in place of the preceding value(s). As of Internet Explorer 8, expressions are supported in IE7 Standards mode and IE5 (Quirks) mode only. For more information, see About Dynamic Properties and Defining Document Compatibility.
Remarks
The listStylePosition property can be applied to any element when margin and display:
list-itemare applied. The display:list-itemproperty is available as of Microsoft Internet Explorer 6 and later.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.
Examples
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.compactas selectors in an embedded (global) style sheet to set the position of the list-item markers.<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>Code example: http://samples.msdn.microsoft.com/workshop/samples/author/dhtml/refs/list-style-position.htm
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'">Code example: http://samples.msdn.microsoft.com/workshop/samples/author/dhtml/refs/listStylePosition.htm
Standards Information
This property is defined in Cascading Style Sheets (CSS), Level 1 (CSS1).
Applies To
CSSStyleDeclaration, currentStyle, LI, OL, runtimeStyle, style, UL, CSSCurrentStyleDeclaration Constructor, CSSRuleStyleDeclaration Constructor, CSSStyleDeclaration Constructor
