-3

Padding

padding-top
padding-right
padding-bottom
padding-left

Marging

margin-top
margin-right
margin-bottom
margin-left

Both are creating spaces... What is the actual difference between the following two sentences?

  1. The CSS padding properties are used to generate space around content.
  2. The CSS margin properties are used to generate space around elements.
3
  • exactly... margin is used when you need to get space between the elements and padding is used to get space within the element... both are different in many ways Commented Feb 25, 2016 at 7:03
  • simply margin for outside the div , padding for inside the div Commented Feb 25, 2016 at 7:04
  • Hope this fiddle helps you to understand the difference... jsfiddle.net/nzu7y37g Commented Feb 25, 2016 at 7:12

2 Answers 2

8

In short padding make "space" inside your box, and margin do this outside of your box.

This picture explain it pretty good :)

enter image description here

Sign up to request clarification or add additional context in comments.

Comments

2

The simple way to look at it is that padding is internal to the border of the content (pad from the inner edge of the line), and margins are external to the border of the content (pad from the outside edge of the line).

Add a border to your content pane in 5px solid black and see the difference in text and border positioning on the page as you change the padding and margin values.

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.