<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<title>CSS Margin Example</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />

<style type="text/css">
<!--
body {margin: 0px;}
#one {background-color: yellow;
 margin: 1cm;}
#two {background-color: #FFD700;
 margin-top: 1cm;
 margin-bottom: 1cm;
 margin-right: .5cm;
 margin-left: -5px;}
#three {background-color: #ADFF2F;}
#bigchar {background-color: red;
 color: white;
 font-size: 28pt;
 font-family: Impact;}
-->
</style>

</head>
<body>

<p id="one">This is a paragraph of text that has margins set for all sides to 1 cm. This is just dummy text to show the effects of the margins. This is just dummy text to show the effects of the margins.</p>

<p id="two">
<span id="bigchar">T</span>his is another paragraph that has negative margins on one side. Be careful not to clip things with negative margins. This is just dummy text to show the effect of the margins. This is just dummy text to show the effect of the margin.</p>

<p id="three">

This paragraph has the default margins for the page, which are set to 0. This is just dummy text to show the effects of the margins. This is just dummy text to show the effects of the margins. This is just dummy text to show the effects of the margins. This is just dummy text to show the effects of the margins.</p>

</body>

</html>

CLOSE WINDOW | VIEW RENDERED PAGE