Bug in Effective distance


#1

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

In the above link, it is mentioned that the effective distance between Element A and Element C is 30px.

Actually,the effective distance between Element A and Element C when both of them are placed one upon other is the sum of the bottom margin of Element A and the top margin of Element C.
now the bottom margin of element A is 10 px and the top margin of Element C is 30 px,So the effective distance between 40px.
but it is mentioned that the effective distance is 30px,

Thank you for reading this.

regards,
vignaan vardhan


#2

no, its not. Because the bottom margin collapses. So the effective distance is 30px


#3

which one should we consider the space of element A or Element c?


#4

this is literally explained within the lesson:

Unlike horizontal margins, vertical margins do not add. Instead, the larger of the two vertical margins sets the distance between adjacent elements.

so if its element A or C depends on which has the larger margin. In this case, C has the larger margin, thus this will be the margin between the two elements.


#5

thanks for your response.


#6

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