<span> and <a> the margin up and down and padding up and down does not work for reasons and solutions

Use to <span> and <a> tags, found in the style directly write Margin-top, Margin-bottom and Padding-top, Padding-bottom are not working, page style of things do not know much, Search, found because <span> and <a> are not block-level elements, so these properties are not valid.

Workaround: Add Display:block to the style and solve the problem.

In the style of span, to ensure that text is centered horizontally and vertically, you need to add the following attributes:
Text-align:center;
line-height:20px;
which text-align:center; As the name implies, no need to explain. line-height:20px; The value of this property needs to be consistent with the height of span.

Display:inline-block is a block-level element in the row, it has the characteristics of block-level elements, you can set the length of the width, you can set the margin and padding value, but it is not exclusive line, its broadband does not occupy the parent element, but the same as the element in the row, Can be in the same row as other inline elements. It combines the characteristics of block-level elements and inline elements.

Position:absolute and float implicitly change the display type, regardless of the previous type of element (except Display:none), as long as Position:absolute, float:left, or float are set: Any of right allows the element to be displayed in a display:inline-block way. Even if we display the Display:inline or display:block, it is still invalid (float in IE 6 double margin bug is the use of add display:inline to solve).

It is important to note that Position:relative does not implicitly change the type of display.

<span> and <a> the margin up and down and padding up and down does not work for reasons and solutions