Padding vs. Margin

The simplest answer is that margin impacts the space outside the element, and padding defines the space inside the element. If you have an h1 element with the word "test" and use the following style, you should see that the word test is very close to the left edge, and the border is close on the top and bottom, and the whole thing is very close to the top left corner of the browser:

h1 {
    border: solid black 1px;
    padding: 0;
    margin: 0;
}

Now, if you change the padding to padding: 25px; you should see the border expands a little bit, and the word "test" moves down and to the right, and the bottom border is further away from the text now.

To see the change in margin, change that line to margin: 25px; and you should see that the border around the text moves down and to the right from the top left corner, as it makes room for the 25px of margin around the outside of it. If you had text underneath the h1 element, it would also have moved down to make room for the 25px margin at the bottom of the element.

Hopefully, that clears it up for you, but if not, just reply and I'll see if I can clarify.