Export (0) Print
Expand All

backgroundPositionX property

Specifies the x-coordinate of the IHTMLRuleStyle::backgroundPosition property.

Syntax

Integer value = object.put_backgroundPositionX(Variant v);Integer value = object.get_backgroundPositionX(Variant* iPositionX);

Property values

Type: VARIANT

length

Floating-point number, followed by a supported length unit.

percentage

Integer, followed by a percent sign (%). The value is a percentage of the width of the object.

ValueMeaning
0%

 

left

Horizontal alignment is to the left.

center

Horizontal alignment is centered.

right

Horizontal alignment is to the right.

String format

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

CSS information

Applies ToAll elements
Mediavisual
Inheritedno
Initial Value0%

Remarks

Starting in Windows Internet Explorer 8, the IHTMLRuleStyle::backgroundPositionX property is an extension to Cascading Style Sheets (CSS), and can be used as a synonym for background-position-x in IE8 Standards mode.

Examples

The following example shows the result of different IHTMLRuleStyle::backgroundPositionX settings for each of the three div objects. The first div object sets IHTMLRuleStyle::backgroundPositionX to 90%. This represents a horizontal offset of 90% relative to the width of the background positioning area. The second div object sets IHTMLRuleStyle::backgroundPositionX to 20 pixels and sets the horizontal offset on the x-coordinate to 20 pixels. The third div object sets the value for IHTMLRuleStyle::backgroundPositionX to center. This is equivalent to a horizontal offset of 50%.

Three div objects demonstrate different background-position-x settings.


<body>
   <div class="circle"></div>
   <div class="square"></div>
   <div class="triangle"></div>
</body>



div {
   width: 200px;
   height: 70px;
   background-color: #D3D3D3;
}
.circle {
   background-image:url(circle.png);
   background-repeat: no-repeat;
   background-position-x: 90%;
}
.square {
   background-image:url(square.png);
   background-repeat: no-repeat;
   background-position-x: 20px;
}
.triangle {
   background-image:url(triangle.png);
   background-repeat: no-repeat;
   background-position-x: center;
}


Requirements

Minimum supported client

Windows XP [desktop apps only]

Minimum supported server

Windows Server 2003 [desktop apps only]

Header

Mshtml.h

IDL

Mshtml.idl

DLL

Mshtml.dll

See also

IHTMLRuleStyle::backgroundPositionY
IHTMLRuleStyle::backgroundPosition

 

 

Community Additions

ADD
Show:
© 2014 Microsoft