css margin collision

Question

Is there a way to detect margin-collision and prevent it? like if I have

        
                      

              相关标签:
       
      

Answer 1

You do not need to do anything; by the box model specs, adjacent bottom and top margins will collapse, so you get a 10-pixel gap between your two <div> elements as opposed to a 20-pixel gap. See this jsFiddle preview.

EDIT: the reason why you're not seeing a collapse between a <table> ad a <div> is because a table is set to display: table by default, which is not exactly the same as a block-level element, so by the specs the margins will not collapse.