Chrome Rendering Inline-Block Höhe falsch

Also was ich brauche, ist eine Menge von Eingaben in einem div und sie müssen die div zu erfüllen.Chrome Rendering Inline-Block Höhe falsch

Im firefox des Inline-Block mit funktioniert gut, aber es hat eine seltsame Verhalten in Chrom als in Plunker zu sehen ist: Plunker

.cl { 
    font-size: 11px; 
    font-family: monospace; 
    background: black; 
    width: 50px; 
    height: calc(14.24px); 
    display: block; 
    border: 0 !important; 
    padding: 0 !important; 
    margin: 0 !important; 
    outline: 0 !important; 
    outline-offset: 0; 
    outline: 0; 
}

Kennt jemand eine Lösung für das?

Quelle

2016-10-26 AMagyar

ich ein anderes div mit Anzeigeblock platziert haben Eingaben zum Vergleichen. – AMagyar

'height: calc (14.24px);' hat keinen Sinn, schreibe 'height: 14.24px;'. Weil 'calc()' eine Funktion ist, um Berechnungen mit verschiedenen Einheiten durchzuführen (zum Beispiel 'calc (100% - 24px)' –

) Ich weiß, calc (fixed px) macht keinen Sinn, ich habe nur Dinge probiert und vergessen, Rollback Diese Änderung – AMagyar

Fügen Sie einfach vertical-align: top; oder einen anderen Wert vertical-align zu Ihren inline-block Elementen hinzu.

Auch calc(14.24px) keinen Sinn macht, verwenden Sie einfach height: 14px;
Vermeiden Sie auch die Verwendung von !important (es gibt fast keinen Grund, es zu verwenden, wenn Ihr CSS gut strukturiert ist)

Quelle

2016-10-26 11:16:18

Ich sehe, dass mit 14px funktioniert, warum kann ich nicht 14.24px verwenden? – AMagyar

@AMagyar Ursache a Pixel ist ein Pixel –

In der Blockanzeige funktioniert es .. – AMagyar

Chrome Rendering Inline-Block Höhe falsch

Antwort

Verwandte Themen