HTML CSS examples for CSS Property:margin-bottom
The margin-bottom CSS property sets the bottom margin of the element.
The following table summarizes the margin-bottom Property
Item | Value |
---|---|
Default value: | 0 |
Applies to: | All elements except those with table display types other than table-caption, table, and inline-table. It also applies to ::first-letter. |
Inherited: | No |
Animatable: | Yes. |
The syntax of the property is as follows:
margin-bottom: length | percentage | auto | initial | inherit
The following table describes the values of this property.
Value | Description |
---|---|
length | A length value in px, pt, cm, em, etc. Negative values are allowed. |
percentage | The margin in percentage. The percentage is calculated with respect to the width of the element's containing block. |
auto | The browser will calculate the margin. |
initial | Sets this property to its default value. |
inherit | take the value of its parent element margin-bottom property. |
The example below shows the margin-bottom property.
<!DOCTYPE html> <html lang="en"> <head> <title>Example of CSS margin-bottom Property</title> <style type="text/css"> h1 {<!-- w w w . j a v a2 s .com--> margin-bottom: 25px; } p { margin-bottom: 50px; } </style> </head> <body> <h1>This is a heading</h1> <p>This is a paragraph.</p> </body> </html>