CSS margin-bottom

The margin-bottom property in CSS is used to set the bottom margin of an element. It determines the space between the bottom edge of an element and its surrounding elements.

It can be set using different units such as pixels, ems, rems, or percentages. The value can be positive, negative, or zero, depending on the desired layout.

Here is an example of how to use the margin-bottom property:

In the example above, the first paragraph has a margin-bottom of 20px, creating space between the two paragraphs.

Here is the HTML and CSS code for the example shown above:

<fieldset class="example">
  <legend>Result:</legend>
  <div style="background-color: lightblue; padding: 10px;">
    <p style="margin-bottom: 20px;">This paragraph has a bottom margin of 20px.</p>
    <p>Another paragraph without a bottom margin.</p>
  </div>
</fieldset>

Try experimenting with different values for the margin-bottom property to see how it affects the layout of your elements.