msOverflowStyle property

Gets or sets the scrolling behavior for elements that overflow.

This property is read/write.

Syntax

HRESULT put_msOverflowStyle(
  [in]  DOMString val
);

HRESULT get_msOverflowStyle(
  [out] DOMString **ptr
);

Property values

Type: DOMString

String format

auto | none | scrollbar | -ms-autohiding-scrollbar

CSS information

Applies To non-replaced block-level elements and non-replaced inline-block elements
Media interactive
Inherited true
Initial Value auto

Remarks

The IHTMLCSSStyleDeclaration2::msOverflowStyle property only has an effect on elements that overflow using the IHTMLRuleStyle::overflow property.

When using auto-hiding scrollbars, you should ensure your content has sufficient padding to prevent interactive content from being obscured beneath the scrollbar.

This property requires Windows 8 or later.

Examples

This example shows two div elements that each contain text. In the first div element, the IHTMLCSSStyleDeclaration2::msOverflowStyle property is set to none. In the second div element, the IHTMLCSSStyleDeclaration2::msOverflowStyle property is set to scrollbar.

div {
  width: 150px;
  height: 150px;
  border-style: solid;
  border-width: thin;
  font-family: sans-serif;
  float: left;
  margin-right: 10px;
  overflow: auto;
}
.of_none {
  -ms-overflow-style: none;
}
.of_scrollbar {
  -ms-overflow-style: scrollbar;
}
<body>
  <div class="of_none">
    Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
  </div>
  <div class="of_scrollbar">
    Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
  </div>
</body>

The following images show the result. In the first div element, text overflows but the div object does not display scroll bars:

In the second div object, text overflows and the div object displays a vertical scroll bar:

Requirements

IDL

Mshtml.idl

See also

Windows apps using JavaScript Samples: HTML scrolling, panning and zooming sample

Internet Explorer Samples: Scrolling, panning, and zooming with touch input