Почему display=inline-block добавляет неконтролируемые вертикальные поля ⇐ Html

[Anonymous]

Я пытаюсь решить свою проблему на http://jsfiddle.net и вижу там странное поведение. Можете ли вы объяснить, откуда берутся эти (http://jsfiddle.net/C6V3S/) вертикальные поля? Появляется на jsfiddle.net (по крайней мере, в Chrome и FF), не появляется при копировании/вставке в локальный автономный файл...




работает нормально после перехода на простой блок



Пример для автономного тестового файла:

.btn {
отступ: 0 пикселей;
граница: 1 пиксель, сплошной красный;
отображение: встроенный блок;


.txt {
display: inline-block;
width: 12px;
height: 12px;
border: none;
padding: 0;
margin: 0;
background: #77FF77;
}





Подробнее здесь: https://stackoverflow.com/questions/200 ... al-margins