.card and .collapse doesn't work together

[dietergeerts]

When reporting a bug, include:

• Operating system and version: Windows
• Browser and version: Chrome Version 63.0.3239.132 (Official Build) (64-bit)
• Reduced test cases: https://codepen.io/dietergeerts/pen/LeggQE
• potential fixes: Imho, collapse is a modifier, where card is specifiyng the element, so eventually collapse should take precedence. An !important could be added, but I don't like that. So probably modifiers should be always added after the element classes?

[mdo]

I haven’t reviewed the example yet, but for context collapse cannot be mixed with anything that has padding, and possibly with things that have margin or border. This is because of how CSS animations collapse from a given height to 0.

[dietergeerts]

I see. Yes, so it is better to have that extra element and collapse that instead. I don't like extra elements, but if that's how css works, then there is no choice.

Either way, I really think this should be added to the docs. As important the classes and how to use things are, so is the reasonings behind choices, as that makes it easier to understand why it should be worked with the way the docs subscribe + we can learn from it.