Was this page helpful?
Your feedback about this content is important. Let us know what you think.
Additional feedback?
1500 characters remaining
Export (0) Print
Expand All

backgroundPositionY property

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

Syntax

Integer value = object.put_backgroundPositionY(Variant v);Integer value = object.get_backgroundPositionY(Variant* iPositionY);

Property values

Type: VARIANT

length (length)

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

percentage (percentage)

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

ValueMeaning
0%

 

vAlignment (vAlignment)

Vertical alignment value.

ValueMeaning
top

Vertical alignment is at the top.

center

Vertical alignment is centered.

bottom

Vertical alignment is at the bottom.

 

String format

<length> | <percentage> | top | center | bottom

CSS information

Applies ToAll elements
Mediavisual
Inheritedno
Initial Value0%

Standards information

There are no standards that apply here.

Remarks

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

As of Internet Explorer for Windows Phone 8.1 Update, Internet Explorer for Windows Phone supports "-webkit-background-position-y" as an alias for this property.

Examples

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

Three div objects demonstrate different settings for the background-position-y property.


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



div {
   width: 70px;
   height: 200px;
   background-color: #D3D3D3;
}
.circle {
   background-image:url(circle.png);
   background-repeat: no-repeat;
   background-position-y: 90%;
}
.square {
   background-image:url(square.png);
   background-repeat: no-repeat;
   background-position-y: 20px;
}
.triangle {
   background-image:url(triangle.png);
   background-repeat: no-repeat;
   background-position-y: 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

IHTMLCurrentStyle::backgroundPositionX
IHTMLRuleStyle::backgroundPosition

 

 

Community Additions

ADD
Show:
© 2015 Microsoft