CSS Selectors Lesson 5 not understood thing


#1

Hey, guys! Look at this syntax:

#div {
	display: inline;
	position: relative;
	margin-left: 70px;
	margin-top: 10px;

I can not understand what's the purpose of "margin-top: 10px". I tried to change the value to whatever number came in my mind, but, no difference? Also, it is a "space" class before and after "div". Has this property a purpose? Thx in advance for the answer.


#2

It was an ID selector


#3

margin-top is the distance from the top of the div, to the thing that's above it. If there are no elements above it, it will define the distance between the top of the div, and the top of the page.


#4

Yes, but there is a space class there and it looks like margin-top property has no purpose to exist in that selector. Thx for answer. By the way, if you change that property with padding-top it will change the layout.


#5

Padding is like margin, but is slightly different: margin-top: 100px; will put 100 pixels between the top of the element, and the bottom of the element above or the top of the page, creating space outside the element padding-top: 100px; will put 100 pixels between the content of the element (e.g. text) and the border, effectively creating space inside the element.