CSS Margin Property
CSS Margin?
The margin property defines the space around an HTML content. It can also be used as negative values to overlap the content.
With one value, the margin property can be used to specify a uniform margin around a box. With two, three, or four values, sides can be specified independently.
The margin CSS property sets the margin area on all four sides of an element.
With CSS, you have full control over the margins. There are properties for setting the margin for each side of an element (top, right, bottom, and left).
The following properties are there to set an element margin.
- margin-top : the
margin-top
property is used to set the margin at top of an element. - margin-Bottom : the
margin-bottom
property is used to set the margin at bottom of an element. - margin-left : the
margin-left
property is used to set the margin at left of an element. - margin-right : the
margin-right
property is used to set the margin at right of an element.
margin-top:
margin-top
property is used to set the margin at top of an element.
Example :
Result :
Hello World we all are in margin-top Wel Come to aimtocode tutorial
margin-bottom:
the margin-bottom
property is used to set the margin at bottom of an element.
Example :
Result :
Hello World we all in margin-bottom Wel Come to aimtocode tutorial
margin-left:
the margin-left
property is used to set the margin at left of an element.
Example :
Result :
Hello World we all in margin-left Wel Come to aimtocode tutorial
margin-rigt
the margin-right
property is used to set the margin at right of an element.
Example :
Result :
Hello World we all in margin-right Wel Come to aimtocode tutorial
All Margine together Example :
Result :
all four margins will be 15px
top and bottom margin will be 10px, left and right margin will be 2% of the total width of the document.
top margin will be 10px, left and right margin will be 2% of the total width of the document, bottom margin will be -10px
top margin will be 10px, right margin will be 2% of the total width of the document, bottom margin will be -10px, left margin will be set by the browser