bootstrap form required field

Reduce the width of the input fields form-control and add float:left to this.

Check the fiddle

CSS changes

.required:after {
    content: "*";
    padding-left:1%;
}

.form-control{
    width:97%;
    float:left;
}

check this fiddle.this will solve ur problem.

http://jsfiddle.net/Dc5yw/1/

change this

<div class="required col-xs-10" >
<input class="form-control1" type="text" />
</div>

.required::after {
 content: "*";
 position:absolute;
 right:0px;
 top:10px;
}

check this JSFiddle

side note: :after is old syntax, now it is ::after