In order to access this site you need to enable JavaScript!

You are here: Reference > JavaScript > client-side > style handling > properties > posBottom

posBottom property

Browser support:

Specifies or retrieves the value of the bottom style property as a floating-point number that specifies the value in the current unit type of the bottom property.

With the bottom style property you can set or return the bottom position of an element with a unit designator as a string. The pixelBottom property specifies or retrieves the bottom position as an integer, in pixels. If you want to set or retrieve the bottom position as a floating-point number that specifies the value in the current unit type of the bottom style property, use the posBottom property.

The properties mentioned above can be used to access style settings. If you need the bottom position of a rendered element, you can use the offsetTop, offsetHeight properties and the getBoundingClientRect method.

The currentStyle.posBottom property is read-only, all others are read/write.

Syntax:

object.posBottom;

You can find the related objects in the Supported by objects section below.

Possible values:

Floating-point number that specifies or retrieves the bottom position.

Default: this property has no default value.

Example HTML code 1:

This example illustrates the use of the posBottom property:

<head>
    <script type="text/javascript">
        function GetBottomPos (elem) {
            var bottomStyle = elem.style.bottom;
            var bottomPos = elem.style.posBottom;
            var bottomPx = elem.style.pixelBottom;
            alert ("The bottom position of the button: " + bottomStyle +
                   "\n without unit type: " + bottomPos + 
                   "\n in pixels: " + bottomPx); 
        }
    </script>
</head>
<body>
    <button style="position:absolute; right:10%; bottom:40%; width:160px; height:30px;" 
            onclick="GetBottomPos (this);">Get bottom position!</button>
</body>