禁用webkit外观的输入元素后的间距

Question

当我禁用输入元素的wekbit外观时，Chrome会不正确地调整其父级的大小。

JSFiddle：http://jsfiddle.net/umttuxm8/

每个中间div（没有类别的中间div）的高度为24 px，尽管孩子的高度为20 px和0 px;没有任何元素具有任何边距，填充或边框。父元素和子元素之间的高度差异总是为每个子元素输入元素4px。

如何删除额外4个像素的空间？

我用来禁用默认输入渲染的特定CSS是

input[type="radio"] {
     -webkit-appearance:none;
     margin:0;
}

编辑：我正在使用Chrome;只有Chrome和Safari支持-webkit AFAIK，因此其他浏览器可能会遇到问题。