Основная идея: попытаться разместить два элемента с нецелой шириной {width: 100.5px;} в ряд {float: left;} внутри контейнера с шириной 200px {width: 200px;}. Если браузер не поддерживает субпиксельные размеры, усекая их в меньшую сторону, то элементы в контейнер поместятся (100px + 100px = 200px), в противном случает второй элемент будет вытеснен из ряда в следующий (100.5px + 100.5px = 201px - шире чем 200px). На случай, если кто-нибудь решит округлять размеры, вторую проверку можно провести в контейнере {width: 201px;} (при округлении 101px + 101px = 202px - шире чем 201px). Вот тестовая страница.
Результаты:
- IE6, IE7, Opera 12.02, Opera 12.10: 100.5px + 100.5px = 200px (два плавающих блока 100.5px помещаются в 200px)
- IE8+, Firefox 15+, Chrome 22+: 100.5px + 100.5px > 200px
http://stackoverflow.com/questions/12604754/is-there-a-way-to-detect-if-the-browser-has-subpixel-precision/12709683#12709683
Комментариев нет:
Отправить комментарий