The margin property creates space on all sides of a page element. It’s also possible to set separate margin spacings on each side of an element.

Additional margin properties:

  1. margin-top: Sets the top margin.

  2. margin-bottom: Sets the bottom margin.

  3. margin-left: Sets the left margin.

  4. margin-right: Sets the right margin.

Note: Below we will change margin properties for a div that encloses HTML figure elements. Figures are used to organize visuals, such as photos and diagrams.



In index.html, figures with the class gallery-item are contained inside a div with a class gallery.

In main.css, locate the .gallery class selector. Set the margin-top property to 20px.

Run your code and notice the change in the web browser: the .gallery div now has more top-margin space.

Take this course for free

Mini Info Outline Icon
By signing up for Codecademy, you agree to Codecademy's Terms of Service & Privacy Policy.
Already have an account?