CSS Margin

CSS margin property is used to set space around elements, outside of any defined borders OR between two and more surrounding HTML elements.

Margin Shorthand Property

The margin property is a shorthand property for the following individual margin properties:

  • margin: Specifies a shorthand property for setting the margin properties in one declaration.
  • margin-top: Specifies the top margin of an element.
  • margin-right: Specifies the right margin of an element.
  • margin-bottom: Specifies the bottom margin of an element.
  • margin-left: Specifies the left margin of an element.

CSS Margin: Example

Output

Hello! This is Text Paragraph with margin property.

Margin Side Values

  • auto: The browser calculates the margin.
  • length: Define a margin in px, pt, cm, etc.
  • %: Define a margin in % of the width of the containing element.
  • inherit: Define the margin should be inherited from the parent element.
  • NOTE: NEGATIVE VALUES ARE ALLOWED IN MARGIN.

CSS margin-top

The CSS margin-top is used to define top margin of an element.

Example of margin-top

Output

Hello! This is Text Paragraph with margin-top property. Basically, This is the example of margin-top.


CSS margin-right

The CSS margin-right is used to define right margin of an element.

Example of margin-right

Output

Hello! This is Text Paragraph with margin-top property. Basically, This is the example of margin-right.


CSS margin-bottom

The CSS margin-bottom is used to define bottom margin of an element and the value in length (% or auto).

Example of margin-bottom

Output

Hello! This is Text Paragraph with margin-bottom property. Basically, This is the example of margin-bottom.


CSS margin-left

The CSS margin-left is used to define left margin of an element and the value in length (% or auto).

Example of margin-left

Output

Hello! This is Text Paragraph with margin-left property. Basically, This is the example of margin-left.


CSS margin - All in One

The CSS margin property is use to spacify margin for all in one. It is most used property for defining margin in CSS.

  • margin: 50px That means 50px margin from all side.
  • margin: 40px 50px That means 40px margin from top & bottom, 50px from left & right.
  • margin: 10px 20px 30px 40px That means 10px margin from top, 20px from right, 30px from bottom, and 40px margin from left.

Policy

GDATAMART.COM is optimized for learning & job information; The users try to improve your knowledge and practical experience through this site but we cannot warrant full correctness of all content... Learn More → | Sitemap →

© 2020 GDATAMART | All Rights Reserved