margin in css code example

Example 1: html inline style margin

<div class="myClass" style="margin-top: 20px;">
<div class="myClass">
<div class="myClass" style="margin-bottom: 20px;">

Example 2: css margin bottom

.yourClass {
  margin-bottom: 25px;
}

Example 3: css margin top

.yourClass {
  margin-top: 25px;
}

Example 4: margin css

/* Apply to all four sides */
margin: 1em;
margin: -3px;

/* vertical | horizontal */
margin: 5% auto;

/* top | horizontal | bottom */
margin: 1em auto 2em; 

/* top | right | bottom | left */
margin: 2px 1em 0 auto;

/* Global values */
margin: inherit;
margin: initial;
margin: unset;

Example 5: how to add a left margin in css

<html>
   <head>
   </head>

   <body>
      <p style = "margin-left: 15px; border:1px solid black;">
         This is a paragraph with a specified left margin
      </p>
      
      <p style = "margin-left: 5%; border:1px solid black;">
         This is another paragraph with a specified top margin in percent
      </p>
   </body>
</html>

Example 6: css margin left

p.ex1 {
 margin-left: 30px;
 }

Tags:

Html Example