Margin - Individual Sides Explain
CSS has properties for specifying the margin for each side of an element:
margin-topmargin-rightmargin-bottommargin-left
All the margin properties can have the following values:
- auto - the browser calculates the margin
- length - specifies a margin in px, pt, cm, etc.
- % - specifies a margin in % of the width of the containing element
- inherit - specifies that the margin should be inherited from the parent element
margin-topmargin-rightmargin-bottommargin-leftHtml Code:
<!DOCTYPE html>
<html>
<head>
<style>
p {
background-color: yellow;
}
p.ex {
border:1px solid red;
margin-top: 100px;
margin-bottom: 100px;
margin-right: 150px;
margin-left: 80px;
}
</style>
</head>
<body>
<h2>Using Individual margin Properties:</h2>
<p>This is a paragraph with no specified margins.</p>
<p class="ex">This paragraph has a top and bottom margin of 100px, a left margin of 80px, and a right margin of 150px.</p>
</body>
</html>
Html Code Result:
Post a Comment