Десятичные знаки в процентах CSS


Хорошо, я искал повсюду и не нашел ничего, кроме анекдотических доказательств, чтобы предположить, что нетрекомендуемого стандартного поведения в спецификации CSS для точности чисел с плавающей запятой.

Б. Н. я не прошу о хорошо известно, суб-пикселя проблему округления.

Причина, по которой я спрашиваю, заключается в том, что IE, похоже, округляет процентные значения с плавающей запятой до 2 десятичных знаков, в то время как Webkit и Gecko позволяют по крайней мере 3, или даже больше (я не проверял).

Например:

li {
    width: 14.768%;
}

При проверке в веб-инспекторе Chrome или Firebug правильно показано, что ширина <li> составляет 14,768%. Однако в IE dev tools (IE9/8 / 7 mode) они имеют ширину 14,76%. Это приводит к тому, что фактические пиксельные значения также полностью отсутствуют.

Может ли кто - нибудь пролить свет на это поведение или предложить подходящий обходной путь? Я бы предпочел не прибегать к пиксельным значениям, если это возможно, так как содержимое должно быть жидкой ширины.

Я знаю, что это довольно грубо, имея дело с таким количеством десятичных знаков, но мне было бы очень интересно узнать, какой из этих браузеров "правильный"?

EDIT

Firefox , по-видимому, использует правильные процентные значения, показанные в инспекторе (не округленные до 2 десятичных знаков), но показывает то же самое поведение, что и IE с точки зрения фактического размещения пикселей.

1 12

1 ответ:

Существует, вероятно, много решений для вашей проблемы, я бы предложил следующее:

  1. округлите на 2 десятичных знака самостоятельно для всех, кроме одного, чем уменьшите от общая ширина для последнего.
  2. Используйте table или display: table, чем браузер исправит ширину сам по себе.