Почему Chrome усекает десятичную ширину таблицы шириной 100% в div?

У меня есть div с десятичной шириной (например, 250.5px) и таблица внутри него с шириной 100%. По какой-то причине Chrome будет обрезать десятичную часть ширины таблицы (например, от 250,5 до 250 пикселей). Когда страница отображается, div округляется в большую сторону, и между правой стороной таблицы и правой стороной div есть разрыв в 1 пиксель. Если я вместо этого вложу div, я не получу эту проблему.

Почему это происходит, и есть ли способ заставить таблицу сохранить десятичную часть? У меня проблема только в Chrome; IE10 выглядит нормально.

Демо выпуска @ http://jsfiddle.net/7UrHa/

HTML:

<div id="redDiv">
    <table id="blueTable">
        <tr>
            <td>
                Content
            </td>
        </tr>
    </table>
</div>

CSS

#redDiv {
    width: 250.5px;
    height: 250px;
    background-color: red;
}

#blueTable {
    width: 100%;
    background-color: blue;
}

1 ответ

Обратитесь к этому для подробного объяснения.

В принципе, если это ширина в процентах, то да, это соблюдается. Однако Chrome обрезает дробные пиксели.

Другие вопросы по тегам