Javascript DOM CSS Style bottom Property set

Introduction

Set the bottom position of a <div> element: 

document.getElementById("myDiv").style.bottom = "10px";

Click the button to position the DIV element 10 pixels from the bottom.

If the position property is set to "static", the bottom property has no effect.

View in separate window 

<!DOCTYPE html>
<html>
<head>
<style>
#myDIV {//from   ww  w . j a  v a2  s.  co m
  position: absolute;
  width: 100px;
  height: 100px;
  background-color: coral;
  color: white;
}
</style>
</head>
<body>
<button onclick="myFunction()">Test</button>

<div id="myDIV">
  <h1>myDIV</h1>
</div>

<script>
function myFunction() {
  document.getElementById("myDIV").style.bottom = "10px";
}
</script>

</body>
</html>



PreviousNext

Related