<link href="//netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <form class="form-horizontal"> <fieldset> <!-- Form Name --> <legend>Member Survey</legend> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="memberID">Member ID</label> <div class="col-md-1"> <input id="memberID" name="memberID" type="text" placeholder="ID" class="form-control input-md"> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="first_name">Full Name</label> <div class="col-md-4"> <input id="first_name" name="first_name" type="text" placeholder="first" class="form-control input-md"> <span class="help-block">first name</span> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="last_name">Last Name</label> <div class="col-md-4"> <input id="last_name" name="last_name" type="text" placeholder="last" class="form-control input-md"> <span class="help-block">last name</span> </div> </div> <!-- Prepended text--> <div class="form-group"> <label class="col-md-4 control-label" for="email">Email</label> <div class="col-md-8"> <div class="input-group"> <span class="input-group-addon">sami.com/</span> <input id="email" name="email" class="form-control" placeholder="yourwebsite" type="text"> </div> </div> </div> </fieldset> </form>