html - テキストフィールドを正確なサイズに設定するのが難しい

Question

position:absolute親divの幅全体を占めるようにテキストフィールドを設定したいと思います。 これが私の質問のフィドルです。アブソリュートでやってみたのですが、ブラウザでは全身を覆って消えてしまいます。私も使えますwidth = 100%。私が使用したことがわかりますが、それでもテキスト フィールドは親 div の外に移動します。前もって感謝します。

div.middle_form_container
{
width:auto;
padding:0px;
margin:15px 10px;
border:solid 1px red;
}
div.middle_form_container > form
{
width:auto;
margin:0px;
padding:0px;
}
div.sign_up_form_text
{
width:100%;
display:inline-block;
margin:0px;
margin-bottom:0px;
padding:0px;
}
div.name
{
width:48%;
margin:0px;
margin-right:0px;
float:left;
padding:0px;
    border:solid 1px blue;
}
div.first_name
{
margin-right:12px;
}
.sign_up_form
{
position:relative;
}
.sign_up_form > input[type=text],.sign_up_form > input[type=email],.sign_up_form >     input[type=password]
{
margin:0px 0 20px 0;
padding:10px;
border:solid 1px #555;
border-radius:6px;
font-family:"Merriweather Sans";
font-size:19px;
outline:none;
}
input.name
{
width:100%;
}
div.other_text_form
{
margin:0px;
padding:0px;
}
input.other_text
{
width:100%;
margin:0px;
padding:0px;
}

Answer 1

input.name ,input.other_text{width:96%;
                             padding:10px 2%;}