Question

I have such html code:

<div class="one1">
<div class="one">
<input class="two" name="user[email]" placeholder="Ваш e-mail" required="required" type="email">
</div>
</div>​

and css

.one1{
    background-color: #000;
    width:200px;
    height: 200px;
}
.one{
    margin: 0 auto;
    background-color: #cecece;
    width:180px;
    height: 200px;
}
.two{
    width: 100%;
    margin: 0;
    padding: 0;
}
​

But why input is little bit to big on right border? How to do it clear as it’s one div? (also there will be rounded borders and shadow)

Here:

link

Answer 1

Best is to remove 1px on each side Left and Right of you input and to set it manualy instead of 100%

.two{
    width: 178px;
    margin: 0;
    padding: 0;
    border:1px solid black;
}