次の Web ページでhttp://achi.co/about.php
フッターの前の下部に向かって、いくつかのボックスがあり、それぞれに数字が表示されています。google chrome では、「+」と「6」の右側の境界線に小さな 1px の線として記述できるものがあります。
これらのボックスはすべて、この 1px 行がない他のボックスと意味的に同一であり、この問題は chrome と firefox に限定されています。
なぜレンダリングされているのか、それを取り除く方法がわかりません。
何か案は？
基礎となるマゼンタっぽいボックスの奇妙な動作は、次の理由によるものです。
1140.cssの27 行目
.row .twocol {
width: 13.44%;
}
width値を に変更すると、13.48%この問題が解決するようです。
ビューポートが十分に小さい場合に表示される境界線について:
意図的でない場合、簡単な修正はここを変更することmargin-rightです:
452行目のstyles.css
.lense {
...
margin-right: -15px;
...
}
に-20px
国境ではありません。これは、(ホバー時に表示される) 後ろの要素が前の要素よりも 1px 広いためです。これらの要素の両方を に設定してみてくださいwidth: 106px。
実際、ブラウザー ウィンドウの幅を約 760 ピクセルに変更すると、赤いオーバーハングが 1 ピクセルをはるかに超えていることがわかります。