Tema genel alan genişliği (.genelalan, .container, ve .row gibi) yüzdelik bir değere sahip ise, ekran çözünürlüğü %100 görünümünde, tablolar 1px kadar küçük gözüküyor.
Genel alan değeri aşağıdaki gibi olduğunda;
.container {
margin: auto auto;
width: 82%;
padding: 16px;
}
Ekran çözünürlüğü %100 görünümde aşağıdaki resimde bulunan 1px kadar küçüklük hatası ortaya çıkıyor;
Aynı şekilde başka bir tarayıcıda baktığımızda, sorun olmadığını görüyoruz;
Yukarıda açıkladığım tarayıcı hatasını kanıtlamak/daha iyi anlatmak için hazırlanmış bir resim;
Konu hakkında araştırma yaptığımızda, bu sorunun benden kaynaklanmadığını ve genel bir tarayıcı hatasını anlıyoruz;
Bkz: http://stackoverflow.com/questions/31719624/displaytable-div-with-percentage-width-1px-bug
Bkz: https://bugs.webkit.org/show_bug.cgi?id=140371
Hatanın çözümü için benim uyguladığım yöntem, genel olarak tanımladığım alana sabit bir değer atamak. Yani 82% yerine, 1024px gibi. Sabit bir değer vermeden bu hatadan kurtulmak isteyenler, genel alan genişliğine (.genelalan, .container, ve .row gibi) display: table ekleyebilirler.
Örneğin;
.container {
margin: auto;
padding: 16px;
width: 82%;
min-width: 1024px;
max-width: 1366px;
/* FIXME: http://stackoverflow.com/questions/31719624/displaytable-div-with-percentage-width-1px-bug */
display: table;
}
Konuyu açmamın amacı ise, bilmeyen arkadaşlarımızı bilgilendirmek ve bu hatayı alan kişilerin, benim gibi kendinden kaynaklanan bir sorun olduğunu düşünüp dakikalarca uğraşmaması içindir.
Saygılarımla, iyi forumlar.