Html And Css related doubts

while providing margin to an element in clockwise notation what will happen if i do naot provide all the 4 input fields
for ex : margin: 10px 5px ;
instead of margin: 10px 5px 10px 5px; ??

if you provide only 2 margins, then it applies the first value to the top & bottom, and the second value to the left & right.

So, margin: 10px 5px ; is identical in practice to margin: 10px 5px 10px 5px;

When you provide 3, then the 2nd value is used twice, once for the left, once for the right.

So margin: 10px 5px 7px; performs the same as margin: 10px 5px 7px 5px;

I hope this helps!

MDN has a really good resource on all of the shorthand properties, I encourage you to read this page and understand it well:


1 Like