Javascript DOM CSS Style marginRight Property

Introduction

Set the right margin of a <div> element: 

document.getElementById("myDiv").style.marginRight = "50px";

View in separate window 

<!DOCTYPE html>
<html>
<head>
<style>
#myDiv {/*from w  ww .  ja  v a 2  s .c  o m*/
  border: 1px solid #FF0000;
}
</style>
</head>
<body>

<div id="myDiv">This is a div.</div>
<br>
<button type="button" onclick="myFunction()">Set right margin</button>

<script>
function myFunction() {
  document.getElementById("myDiv").style.marginRight = "50px";
}
</script>

</body>
</html>

The marginRight property sets or gets the right margin of an element.

Both the margin property and the padding property insert space around an element.

The margin inserts the space around the border.

The padding inserts the space within the border of an element.

Property Values

Value Description
% Sets the right margin in % of the width of the parent element
length Sets the right margin in length units
autoThe browser sets the right margin
initial Sets this property to its default value.
inherit Inherits this property from its parent element.

The marginRight property Default Value: 0

The marginRight property returns a String representing the right margin of an element.




PreviousNext

Related