bottom Property - Javascript CSS Style Property

Javascript examples for CSS Style Property:bottom

  1. HOME
  2. Javascript
  3. CSS Style Property
  4. bottom

Description

The bottom property sets or gets the bottom position of an element.

Property Values

Value Description
length a length value in px, pt, cm, em, etc. Negative length values are allowed.
percentage The percentage is calculated with respect to the height of the element's containing block. Negative percentage values are allowed.
auto The browser calculates the bottom edge position. Default value.
initialSets this property to its default value.
inherittake the value of its parent element bottom property.

Technical Details

Item Value
Default Value: auto
Return Value: A String, representing the bottom position of a positioned element
CSS VersionCSS2

Get the bottom position of a <button> element:

Demo Code

ResultView the demo in separate window 

<!DOCTYPE html>
<html>
<body>

<div id="myDiv" style="position:absolute;bottom:0px;">This is a div element.</div>

<button type="button" onclick="myFunction()">Return bottom position of div</button>

<script>
function myFunction() {//from w  w  w .jav a  2s . com
    console.log(document.getElementById("myDiv").style.bottom);
}
</script>

</body>
</html>

Related Tutorials