<div id="outerDiv">
<div id="innerDiv"></div>
<div id="remainderDiv"></div>
</div>
#outerDiv, #innerDiv, #remainderDiv{
height: 100px;
}
#outerDiv{
width: 55.5px;
z-index: 1;
background-color: red;
}
#innerDiv{
width: calc(100% - 10px);
z-index: 100;
background-color: blue;
float: left;
}
#remainderDiv{
width: 10px;
z-index: 100;
background-color: green;
float: left;
}
http://jsfiddle.net/yz8cwj3a/Хром 37 известково округлением
Результат: http://i.imgur.com/DYor2yb.png
Эта скрипка показывает проблему с Chrome 37. Использование выч (100% - 10px) функции на элементе с десятичными пикселей, он всегда округляется. Это вызывает странные вещи.
В примере внешний div имеет ширину 50,5 пикселей. Два внутренних divs имеют значение calc (100% - 10px) и 10px как ширины. Несмотря на то, что это должно быть 50,5 всего, он по-прежнему показывает красный фон.
Проблема, кажется, введена в Chome 37. Кто-нибудь знает, была ли эта проблема уже сообщена и/или если она будет решена?
Редактировать: Я понимаю из комментариев, что проблема уже присутствует в течение более длительного времени. Есть ли какой-нибудь (кросс-браузерный) аккуратный способ исправить это?
Этого вопрос, кажется, присутствует в Chrome, так как известково был реализован [то между версиями 23 и 26] (http://app.crossbrowsertesting.com/public/i4fc93605bfe96a0/screenshots/zc4fbbf828e8096be866?size = small & type = windowed & browser_type = Chrome) Это проблема в каждой версии Chrome до сих пор. – misterManSam
Эта проблема не ограничивается единицами 'px'. [Вот такая же проблема с 'em'] (http://jsfiddle.net/cps5b1vy/). ([Это ленивый способ рассчитать em единиц из px] (http://pxtoem.com/)) – misterManSam
Что будет выглядеть ** на пол-пикселя **? –