Never heard about collapsing paddings till now but I encounter a curious effect:
https://jsfiddle.net/Sempervivum/vbkL69k1/
When the viewport is narrow so that the labels wrap, the lower labels cover the upper ones a bit.
HTML:
<div class="tabbed">
<label for="tabbed1">Standardfarben1</label>
<label for="tabbed2">Standardfarben2</label>
<label for="tabbed3">Standardfarben3</label>
<label for="tabbed4">Standardfarben4</label>
</div>
.tabbed label {
border: 1px solid #ddd;
border-bottom: none;
border-top-left-radius: 4px;
border-top-right-radius: 4px;
padding: 0.25em 0.75em;
box-shadow: 0 0 0.5em rgba(0,0,0,0.0625);
background: #fff;
cursor: pointer;
box-sizing: border-box;
}
This is not a collapsing margin problem (or even a collapsing padding). <label>
has no line height set for it so you just need to set an appropriate line height such as line-height:1.5;