What causes CSS, HTML, javascript, or React to combine margins?

Question

I have an element with a margin at the bottom of 10px. And immediately under this element, I place another element with margin at the top of 10px.

Now there is exactly 20px of whitespace between these 2 elements.

What could be the cause of this behavior?

Not sure I follow as that is expected. What is your expectation? — Dejan.S, Jan 11 '22 at 18:28
Margins by default overlap? So there should only be `10px` of margin between these 2 elements — Bear Bile Farming is Torture, Jan 11 '22 at 18:29
Why would there not be 20px? We need to see the markup and css to say why it would be 20 or 10 — epascarello, Jan 11 '22 at 18:33
Not in all cases, if you have `display: flex;` on the parent it will. Just curious what's the reason to add bottom and top in this case? :) — Dejan.S, Jan 11 '22 at 18:34

score -1 · Answer 1 · answered Jan 16 '22 at 12:52

-1

Maybe you're giving some default margin in the body section.

So you can try saving this using:

body{ margin:0 }

answered Jan 16 '22 at 12:52

VANSH SHARMA

1
1

What causes CSS, HTML, javascript, or React to combine margins?

1 Answers1