डाउनलोड पी.डी.एफ. ई-बुक्स
CSS - Margins

margin-top:20px;

margin-right:50%;

margin-left:50%;

margin-bottom:50px;

This text has been taken to show the effect of margin-bottom.



CSS Margins से element के top, right, bottom और left side के लिए margin दी जाती है | Margins ये negative values भी हो सकती है, लेकिन अगर negative value दी जाती है तो elements एक दुसरे पर overlap होने संभावना होती है |

Margins के demonstration के लिए आप border का इस्तेमाल कर सकते है |

Margins related Properties


Example for margin property CSS Margins

margin property पर आप top right bottom और left के sequence में margins को set कर सकते है |

Example पर margin:50px; ये top,right,bottom और left इन चारों margins के लिये 50px लिया गया है |

<p style="margin:50px;">margin:50px;</p>
Output :

margin:50px;




Live Example


Example पर 50px margin ये top,bottom के लिए है और 30px margin ये right,left के लिये दिया गया है |

<p style="margin:50px 30px;">margin:50px 30px;</p>
Output :

margin:50px 30px;




Example पर 50px ये top, 30px ये right और left के लिए और 10% ये bottom के लिए दिया गया है |

<p style="margin:50px 30px 10%;">margin:50px 30px 10%;</p>
Output :

margin:50px 30px 10%;


CSS Margins Properties

PropertyDescription
marginइस property पर element के लिए सभी margin properties दी जाती है |
margin-topElement पर top margin set की जाती है |
margin-rightElement पर right margin set की जाती है |
margin-bottomElement पर bottom margin set की जाती है |
margin-leftElement पर left margin set की जाती है |