This page is Ready to Use

Notice: The WebPlatform project has been discontinued when the Stewards partnership agreement ended in September 2015. This site has been frozen, and the assets we have created will remain.

regionOverset

Summary

A region’s display state within a region chain.

Property of apis/css-regions/Regionapis/css-regions/Region

Syntax

Note: This property is read-only.

var regionState = region.regionOverset;

Return Value

Returns an object of type StringString

A region’s display state within a region chain:

  • overset indicates the region is the last in the chain, and does not have enough room to display remaining content. See region-fragment for display options.

  • empty indicates content was accommodated by previous regions in the chain, or that no content is available to flow into the chain.

  • fit indicates various scenarios:

    • When content appears within the last region in the chain but does not overflow it, as described above in overset
    • For regions that flow content into subsequent regions in the chain
    • For regions that are too small to display the next available item of content, such as an image, which gets pushed into a subsequent region
    • For elements that no longer behave as a region, which occurs when their flow-from property reverts to none

Examples

Check if region needs to be deleted or appended:

if (region.regionOverset == 'empty') {
    // delete region?
} else if (region.regionOverset == 'overset') {
    // add additional regions?
}

Notes

Not to be confused with overset, which indicates whether the overall named flow features too few display regions.

Related specifications

CSS Regions Module Level 1
W3C Working Draft

See also

Related articles

Regions

External resources