CSS | margin-right Property
The margin-right property in CSS is used to set the right margin of an element. It sets the margin-area on the right side of the element. Negative values are also allowed. The default value of margin-right property is zero.
Syntax:
margin-right: length|auto|initial|inherit;
Property Value:
- length: This property is used to set a fixed value defined in px, cm, pt etc. The negative value is allowed and the default value is 0px.
Syntax:
margin-right: length;
Example:
html
<!DOCTYPE html><html> <head> <title> margin-right property </title> <!-- margin-right property --> <style> h1 { margin-right: 100px; border:1px solid black; } h2 { margin-right:250px; border:1px solid black; } </style> </head> <body style = "text-align:center"> <h1>GeeksforGeeks</h1> <h2>margin-right property</h2> </body></html> |
Output:
- auto: This property is used when it is desired and it is determined by browser.
Syntax:
margin-right: auto;
Example:
html
<!DOCTYPE html><html> <head> <title> margin-right property </title> <!-- margin-right property --> <style> h1 { margin-right: auto; border:1px solid black; } h2 { margin-right:auto; border:1px solid black; } </style> </head> <body style = "text-align:center"> <h1>GeeksforGeeks</h1> <h2>margin-right property</h2> </body></html> |
Output:
- initial It sets the value of right-margin to its default value.
Syntax:
margin-right: initial;
Example:
html
<!DOCTYPE html><html> <head> <title> margin-right property </title> <!-- margin-right property --> <style> h1 { margin-right: initial; border:1px solid black; } h2 { margin-right:initial; border:1px solid black; } </style> </head> <body style = "text-align:center"> <h1>GeeksforGeeks</h1> <h2>margin-right property</h2> </body></html> |
Output:
- inherit: This property is inherited from its parent.
Supported Browsers: The browser supported by margin-right property are listed below:
- Google Chrome 1.0
- Edge 12.0
- Internet Explorer 3.0
- Firefox 1.0
- Safari 1.0
- Opera 3.5
Please Login to comment...