| The CSS margin properties define the space around elements. It’s opposite to padding. Negative values can also be used to overlap content. A shorthand margin property can be used to change all of the margins at once. The top, right, bottom, and left margin can be changed independently using separate properties. |
| Note: |
| Netscape and IE give the body tag a default margin of 8px. On the otherhand Opera does not give any such margin! Instead, Opera applies a default padding of 8px, so if one wants to adjust the margin for an entire page and have it display correctly in Opera, the body padding must be set as well! |
| An element has four sides: right, left, top and bottom. The margin is the distance from each side to the neighboring element (or the borders of the document). |
| As the first example, we will look at how you define margins for the document itself i.e. for the element<body>. The illustration below shows how we want the margins in our pages to be. |
 |
| The CSS code for this would look as follow: |
| <!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.0 Transitional//EN”> <HTML> <HEAD> <TITLE>CSS Padding example</TITLE> <style> body { margin-top: 120px; margin-right: 30px; margin-bottom: 100px; margin-left: 80px; } </style> </HEAD> <BODY> <h2>CSS Margin example</h2> </BODY> </HTML> |