Chrome

2016-04-02 32 views
0

'daki bir sütunun rastgele sol tarafında bulunan beklenmeyen kenarlık İçinde 24 sütun bulunan bir satır oluşturur. Hücre arasında oluk ve kenarlık koymadım, böylece her sütun birbiri ile yığıldı. Ancak, Chrome tarayıcısında tuhaf bir şey buldum. Bir sütunun rastgele sol tarafında sınırlar vardır. Krom: enter image description hereChrome

Firefox: enter image description here

kimse bunun ne koşul bana açıklayabilir misin? Teşekkür

Ek bilgiler:

  • bir kolon A satır ilave elemanları inline-block% 100 genişlik

+0

'html' ve' css' kodunuzu paylaşabilir misiniz? – Pedram

+0

@jiff Bence sorun tarayıcı, html ve css değil. Belki birisi bunu daha önce görmüştü. –

+0

Hayır Ben 'html' sorunu ya da başka söylemek istiyorum, ben bir canlı demo görmek ve karşılaştırmak için 'chrome' ve 'yangın tilki' üzerinde test istiyorum. veya en azından bunu krom üzerinde kaldırmak için bir numara bulun. Ayrıca, bazen krom, FF'den daha iyi bir html sorunu gösterir. ve ben senin css üzerinde negatif marjı görüyorum, iyi değil! – Pedram

cevap

1

display:inline-block, margin-right:-4px, position:relative ve vertical-align:top

  • kullanım alanına sahip olan HTML etiketleri arasındaki boşluklar nedeniyle beyaz boşluklar eklenecektir satır sonları ve sekmeler boşluk olarak sayılır.

    Bu beyaz boşluk, üst kapsayıcısının yazı tipiyle belirlenir. margin-right: -4px ayarının kullanılması, kullanılan yazı tipine bağlı olarak 3x veya 5px olabileceği için kullanılmaz.

    Here, font-size öğelerinin öğeler arasındaki boşluğu nasıl etkilediğinin bir örneğidir.

    Bu alanlarla savaşmak için daha zarif bir çözüm, öğelerinizi yüzdürmek ve satır içi blokları kullanmamak ya da flexbox kullanmak olabilir.

  • +0

    Ana kapsayıcının yazı tipi boyutunu 0 olarak ayarlar ve alt öğeler normal boyutlarına geri döner. – tayvano

    +0

    @KrisD Daha önce bu sorunun Chrome'da ortaya çıkmadığını söylemeliyim. İyi çalışıyor. Ama başka bir zaman için, bu sorunu hemen aldım. Bunun bir açıklaması var mı? –

    +0

    @tayvano - yaklaşımınızla ilgili tek dezavantaj, ems kaskadından bu yana çocukların sıfır boyutuna sahip olacağından yazı tipi boyutlandırması için ems kullanırken. – KrisD