Deprecated: mysql_connect(): The mysql extension is deprecated and will be removed in the future: use mysqli or PDO instead in /home/myscript/public_html/classes/classdb.php on line 42
Set Top Margin - CSS (HTML) Tutorial

CSS Top Margin

How to create a big blank space between two paragraph in html?
Set top margin using style sheet.

Explanation

Property :

Top Margin

Usage:


margin-top: 10px;
margin-top: 10pt;
margin-top: 10%;
margin-top: auto;

Definition:


Many times we would need to set margin for our objects. This will set the top margin of the object.
It takes the following values.
a)pt : You can set values in points. (e.g: 10pt or 100pt).
b)px : You can set values in pixels. (e.g: 10px or 100px).
c)% : You can set values in percentage. (e.g: 10% or 100%).
d)auto : This will set a automatic margin.

Examples


Example 1:


<div style="margin-top: 20px;">testing top margin</div>
Result:

testing top margin

Note: You can see that the text has moved 20 pixels down from "Result" string.

Example 2:


<div style="margin-top: 30pt;">testing top margin</div>
Result:

testing top margin

Note: You can see that the text has moved 30 points down from "Result" string.

Example 3:


<div style="margin-top: 10%;">testing top margin</div>
Result:

testing top margin

Note: You can see that the text has moved 10 percentage down from "Result" string.

Example 4:


<div style="margin-top: auto;">testing top margin</div>
Result:

testing top margin


Ask Questions

Ask Question