I have used my custom framework for responsive.
In mobile view less than (768px resolution) textbox is breaking my container. It goes oustside the container and not considering the container padding.

Here is my html:

```
<div class="container">
<div class="col-3">
<input type="text" />
</div>

<div class="col-3">
<input type="text" />
</div>

<div class="col-3">
<input type="text" />
</div>
</div>

```

Here is the CSS :

```
* { margin:0px; padding:0px; }
.container { width:1170px; margin:0px auto;  }
.col-3 { float:left; width:30%; margin-right:3%; background:#CCC;  }
input { border:0px none; background:#333; height:30px; line-height:30px; width:100%; color:#FFF; padding:0px 10px; }

@media (max-width:767px)
{
.container { width:auto; padding:0px 10px; }
.col-3 { float:none; width:100%; margin-bottom:10px }
}

```

[FIDDLE LINK](http://jsfiddle.net/gbgB4/30/)