Margin Collapse


#1

Hi, guys. I’m new here. Apologize in advance if I chose a wrong category.
I’m learning CSS and got stuck when I faced such topic as “Margin Collapse”.

Could you please explain me the theory a little bit easier? I gotta mention that the main difficulty for me is to imagine how it’d be implemented in practice.

Thank you in advance for all your answers.


#2

Not sure what the exact question is here. Could you please link us to the exercise for context? Thank you.


#3

Here is the link:
https://www.codecademy.com/courses/learn-css-box-model/lessons/box-model-intro/exercises/margin-collapse?action=resume_content_item&course_redirect=learn-css


#4
div {
  margin: 30px auto;
}

Because of built in margin collapse, the distant between div’s vertically will be 30px, not 60px. This is similar in nature to border-collapse on tables.


#5

w3c still has the best explanation about when margins do and do not collapse:

https://www.w3.org/TR/CSS2/box.html#collapsing-margins

i can highly recommend reading it


#6

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.