CSS - Ingresso al 100% la larghezza si sovrappone div

Question

sto cercando di risolvere una casella di regolare con imbottitura, bordo, all'interno di un div con imbottitura. Tuttavia, voglio che l'input abbia una larghezza pari al 100% ma, come puoi vedere, si sovrappone. Come posso risolvere questo?

CSS

#one { 
    background:red; 
    width:300px; 
    padding:5px; 
} 
#two { 
    width:100%; 
    border:3px solid blue; 
    padding:4px; 
} 

HTML

<div id="one"><input type="text" value="Test" id="two" /></div>​ 

Answer 1

Aggiungi box-sizing: border-box. Altrimenti, la larghezza è 100%, PIÙ il bordo e il riempimento.