14
As the title already says: What exactly is the difference between margin: 0 auto;
and margin: auto;
?
margin: 0 auto;
margin: auto;
Why can you only use 0? What would be the unit of that 0? px? %?
14
As the title already says: What exactly is the difference between margin: 0 auto;
and margin: auto;
?
margin: 0 auto;
margin: auto;
Why can you only use 0? What would be the unit of that 0? px? %?
20
First of all, you need to understand how to write a margin. There are 4 ways to write the margin, understanding that it works in clockwise starting from the top. Understand that when a side is not defined, it will use the same defined for its opposite.
margin: /* top right bottom left */
margin: 0; /* margem de todos os lados = 0 */
margin: 0 1px; /* top/bottom = 0; right/left = 1px */
margin: 0 1px 2px; /* top = 0; right/left = 1px; bottom = 2px */
margin: 0 1px 2px 3px; /* top = 0; right= 1px; bottom = 2px; left = 3px */
It means that the browser will give a automatic margin for all sides. The automatic margin will not work at all times because it needs a logic to work.
For example, in an element that has display: block
as is the default for a div, by putting margin: 0 auto;
, means that you will give automatic margins on the left and right to center the block horizontally on the screen.
The 0 margin means you don’t want any margin.
To clarify why "0" does not require units: independent of the unit, because in any unit 0 = 0. It could be 0px, 0rem, 0em, 0% and it would all be the same because they all have zero value. It is different from, for example: 1px, 1rem, 1em, 1%; these results would all have different values, because only 1px is a static value. The other three values depend on the construction or other page values and may have very different results. In conclusion, a 0 will probably never need a unit as its value will be null.
8
When you put:
margin: 0 auto;
You are setting margins esquerda e direita
of the element to auto
and the upper and lower margins to 0
.
When you say:
margin: auto;
You are adding to the margin element auto
everywhere. (left,top, right, bottom)
5
margin: 0 auto;
Defines the margins esquerda
and direita
of the element and the margins auto
above and below 0
.
margin: auto;
Sets all margins to auto
.
-2
margin: auto; This means that all margins of the element will be calculated automatically margin: 0 auto; That means the upper and lower margins will be 0px and the left and right margins will be automatic
AUTOMATICS: meaning that the interpreted will make a calculation based on the width or height of the element so that both margins have the same size
this is quite used to center elements, but for this it is important that you set a width (if you want it to have equal margins on both sides) for the div or the element you want to center on the screen.
Nothing different from the 2017 response...
Browser other questions tagged html css
You are not signed in. Login or sign up in order to post.
Whoever it was that negatived it. Any specific reason?
– Leon Freire
Excellent, exactly the answer I would put. Only perhaps would I change one detail by simplification: when only two values are defined, it is said that the first will be vertical spacing and the second horizontal spacing. In terms of terms it is a little more concise than saying "top and bottom" and "left and right" (in this specific case). Overall, that’s exactly it.
– Woss
@Thanks Andersoncarloswoss. Really could have been more concise in that detail. So I kind of said this before, but I’m going to adapt it for simplification.
– Leon Freire
This 0 is pixel?
– Lucas de Carvalho
@Lucascarvalho It’s like I explained in bold at the end of my answer. It’s nothing because it doesn’t have to be anything.
– Leon Freire
Got it, thanks Leon!
– Lucas de Carvalho
@Lucascarvalho I worked out my ending better, if you still have doubts, take a look there.
– Leon Freire
Negative for some specific reason?
– Leon Freire