paddingTop Property - Javascript CSS Style Property

Javascript examples for CSS Style Property:paddingTop

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

Description

The paddingTop property sets or gets the top padding of an element.

Property Values

Value Description
% top padding in percentage of the width of the parent element
length top padding in length units
initial Sets this property to its default value.
inherit Inherits this property from its parent element.

Technical Details

Item Value
Default Value: 0
Return Value: A String, representing the top padding of an element
CSS VersionCSS1

Set the top padding of a <div> element:

Demo Code

ResultView the demo in separate window 

<!DOCTYPE html>
<html>
<head>
<style>
#myDiv {//from ww  w .j av  a  2  s.c  om
    border: 1px solid #FF0000;
}
</style>
</head>
<body>

<div id="myDiv" style="padding-top:5cm;">This is a div.</div>
<br>
<button type="button" onclick="myFunction()">Return top padding</button>

<script>
function myFunction() {
    document.getElementById("myDiv").style.paddingTop = '10px';
}
</script>

</body>
</html>

Related Tutorials