Students Empire

Learn Something New
Home

margin property


The margin property controls the gap between boxes, and its value is either a length, a percentage, or inherit , each of which has exactly the same meaning as it did for the padding property you just saw.


p {margin:20px;}


As with the padding property, the values of the margin property are not inherited by child elements unless you use the value inherit .


Also, remember that when one box sits on top of another box, only the larger of the two margins will show.


  • margin-bottom
  • margin-top
  • margin-left
  • margin-right

              body {
          color:#000000;
          background-color:#ffffff;
          font-family:arial, verdana, sans-serif;
          font-size:12px;}
          p {
          margin-top:40px;
          margin-bottom:30px;
          margin-left:20px;
          margin-right:20px;
          border-style:solid;
          border-width:1px;
          border-color:#000000;}
          em {
          background-color:#cccccc;
          margin-left:20px;
          margin-right:20px;}