Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS

Posted by Aaron Banerjee
Aaron Banerjee
2,509 Points

Hi, I needed somebody to clear up a bit of css for me

Hi, I am having some trouble understanding some css properties as it is my first time every doing web design

These include margin (definition and what negative margins like -5 would do) inline block padding

if you could include some examples and definitions, it would be greatly appreciated

1 Answer

Chyno Deluxe
Chyno Deluxe
16,936 Points
Chyno Deluxe
Chyno Deluxe
16,936 Points

Hey Aaron, Here is an excerpt from w3schools on the CSS Box Model

The Box Model

Explanation of the different parts:

  • Content - The content of the box, where text and images appear
  • Padding - Clears an area around the content. The padding is transparent
  • Border - A border that goes around the padding and content
  • Margin - Clears an area outside the border. The margin is transparent

To answer your question about the negative margin and the inline-block properties.

The negative margin goes works the same as the margin property only instead of pushing surrounding elements back it brings them close to the element.

Here is another excerpt from w3schools to explain the inline-block property

inline-block - Displays an element as an inline-level block container. The inside of this block is formatted as block-level box, and the element itself is formatted as an inline-level box.

I hope this helps.