How to set the right margin property using percent values with CSS
The code below shows you how to set the right margin property using percent values with CSS
The text-align: property with the value of right has been added to the paragraphs to help you see the effects of the use of the right margin property.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Web Development Tutorials.com</title>
<style type="text/css">
p.one
{
margin-right: 0;
text-align: right;
border: thin double #000;
}
p.two
{
margin-right: 25%;
text-align: right;
border: thin double #000000;
}
</style>
</head>
<body>
<p class="one">
This paragraph has a right margin of 0.
</p>
<p class="two">
This paragraph has a specified right margin of 25%.
</p>
<p class="one">
This paragraph has a right margin of 0.
</p>
</body>
</html>
The code above creates the paragraphs below.
This paragraph has a right margin of 0.
This paragraph has a specified right margin of 25%.
This paragraph has a right margin of 0.
Use the text editor below to practice what you have learned.