Десятичные разряды в процентах CSS
Хорошо, я искал по всему миру и придумывал не что иное, как анекдотические доказательства того, что в спецификации CSS не рекомендуется стандартное поведение для точности чисел с плавающей запятой.
N.B. Я не спрашиваю о хорошо известной проблеме округления пикселов.
Причина, по которой я спрашиваю, заключается в том, что IE, похоже, округляет процентные значения с плавающей запятой до 2 десятичных знака, тогда как Webkit и Gecko позволяют не менее 3 или даже больше (я не знаю, t).
Например:
li {
width: 14.768%;
}
При проверке в Chrome Web Inspector или Firebug показано, что <li>
имеет ширину 14,768%. Однако в IE dev tools (режим IE9/8/7) они имеют ширину 14,76%. Это приводит к тому, что фактические значения на основе пикселов также будут полностью исключены.
Может ли кто-нибудь пролить свет на это поведение или обеспечить подходящее обходное решение? Я бы предпочел не прибегать к пиксельным значениям, если это возможно, поскольку содержимое должно быть шириной жидкости.
Я знаю, что это довольно gnarly, имея дело с этим множеством знаков после запятой, но мне было бы очень интересно узнать, какой из этих браузеров "правильный"?
ИЗМЕНИТЬ
Похоже, что Firefox использует правильные процентные значения, если он отображается в инспекторе (не округлен до двух знаков после запятой), но показывает то же поведение, что и IE с точки зрения фактического размещения пикселей.
Ответы
Ответ 1
Вероятно, есть много решений для вашей проблемы, я бы предложил следующее:
- Раунд по 2 десятичным знакам для всех, кроме одного, чем сокращение от
общая ширина для последнего.
- Используйте
table
или display: table
, чем браузер самостоятельно установит ширину.