xFactorSchool.com(Beta)
How to Do Examples
Python Examples
HTML Examples
Code Examples
C Code Examples
C++ Code Examples
C# Code Examples
Java Code Examples
Python Code Examples
HTML Code Examples
CSS Code Examples
JavaScript Code Examples
Online Editor
C Code Editor
C++ Code Editor
C# Code Editor
Java Code Editor
Python Code Editor
HTML Code Editor
CSS Code Editor
JavaScript Code Editor
Practice how to set margin at the bottom of an HTML element using CSS
CSS Online Editor
Run Code
More CSS Sample Codes
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Set margin at the bottom of an HTML element using CSS</title> <!--Internal CSS added--> <style> /* CSS id name used to apply css style to the divs*/ #div-1 { margin-bottom: 20px; /*20px margin at bottom side of the div*/ background-color: lightpink; /*background color of the div*/ } #div-2 { margin-bottom: 40px; /*40px margin at bottom side of the div*/ background-color: lightblue; /*background color of the div*/ } #div-3 { background-color: green; /*background color of the div*/ } div { min-height: 60px; } </style> </head> <body> <h1>How to set margin at the bottom of an HTML element using CSS?</h1> <h3 style="color:orangered;">Use margin-bottom css property to set margin at the bottom of the HTML element</h3> <div id="div-1">First div with 20px margin at bottom</div> <div id="div-2">Second div with 40px margin at bottom</div> <div id="div-3">Third div with no margin</div> </body> </html>
CSS Online Editor
CSS Online Editor