问题
There are circumstances under which elements' vertical margins will collapse. Sometimes the author doesn't want this to happen, and I understand that the only way to "un-collapse" margins is to:
- Set a
bordersized >=1px - Set a
paddingsized >=1px
These workarounds make sense to me, but they are just that: workarounds, and they have drawbacks. I'm surprised that there's not some kind of css3 property like margin-collapse: none;, similar to border-collapse.
Is it really true that setting a border/padding is the only way to uncollapse margins?
回答1:
No, there are numerous other ways, including floating, clearance, absolute positioning, setting overflow to values other than visible, setting a certain min-height, etc, which you can determine based on what the spec says.
But you're right in that all of these are workarounds with various side effects and disadvantages, and there is no true "off switch" available in CSS like margin-collapse, not even in the CSS3 Box Model module. A possible rationale is that margin collapse is supposed to happen naturally, and therefore the only way it can be prevented is as a side effect, but that's just my guess, as I agree there are several cases where it isn't intuitive or appropriate.
That said, if you're feeling adventurous you could make a suggestion on the www-style mailing list, and see what they say. I don't think you're going to have much luck, though.
来源：https://stackoverflow.com/questions/12000166/why-no-rule-for-un-collapsing-margins