css - Bootstrap data error displaying breaks the layout -


sorry if stupid question i'm unable figure simple layout

this input field email field , if users enters invalid email shows error seen below:

<div class="form-group">     <label for="txtemail" class="col-sm-3 control-label">email address:</label>     <div class="col-sm-9">         <div class="input-group  col-md-12 form-group has-feedback">             <span class="input-group-addon">                 <span class="glyphicon glyphicon-envelope"></span>             </span>             <input type="email" id="txtemail" class="form-control" placeholder="enter email address" data-minlength="50" data-error="please enter valid email address" required>             <span class="glyphicon form-control-feedback" aria-hidden="true"></span>             <div class="help-block with-errors"></div>         </div>     </div> </div> 

and result displayed as:

enter image description here

i need shown below:

enter image description here


Comments

Popular posts from this blog

sublimetext3 - what keyboard shortcut is to comment/uncomment for this script tag in sublime -

java - No use of nillable="0" in SOAP Webservice -

ubuntu - Laravel 5.2 quickstart guide gives Not Found Error -