Жидкие макеты и границы

Question

У меня проблемы с жидким макетом и границами, что приводит к переполнению элементов.

• Вот jfiddle с примером страницы без границ (работает нормально): http://jsfiddle.net/eRaB5/1/
• Теперь вот пример того, чего я хочу, но оно ломается.http://jsfiddle.net/eRaB5/2/

Структура выглядит примерно так:

<div id="container">
    <label>Label</label><input type="text' />
</div>

#container{width: 100%;}
label{width: 25%;}
input{width: 75;}

Мне нужно добавить значения до 100%, чтобы выровнять левый и правый края.Только границы на входе эффективно делают ширину ввода width: 100% +2px;

Есть ли способ обойти эту проблему, используя только CSS?

Answer 1

Отрицательные поля

Вы можете попробовать установить отрицательные поля:

margin: -1px;

Я изменил их на вашем jsFiddle, и текстовые поля переместились справа от метки.

Answer 2

Исправлено:

http://jsfiddle.net/Mutant_Tractor/eRaB5/3/

Просто добавьте

margin: -1px;

к .input-text классу.