<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.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 ----------> <div class="container"> <div class="row"> <!-- Form Name --> <form class="form-horizontal"> <fieldset> <legend>Ad Details</legend> <!-- Multiple Radios --> <div class="form-group"> <label class="col-md-4 control-label" for="selling_buying">Ad Type</label> <div class="col-md-4"> <div class="radio"> <label for="selling_buying-0"> <input type="radio" name="selling_buying" id="selling_buying-0" value="1" checked="checked"> Selling </label> </div> <div class="radio"> <label for="selling_buying-1"> <input type="radio" name="selling_buying" id="selling_buying-1" value="2"> Buying </label> </div> </div> </div> <!-- Prepended checkbox --> <div class="form-group"> <label class="col-md-4 control-label" for="Price">Price</label> <div class="col-md-5"> <div class="input-group input-group-sm"> <span class="input-group-addon"><input type="checkbox"></span> <input id="Price" name="Price" class="form-control" type="text" placeholder="0.00"> </div> </div> </div> <!-- Multiple Checkboxes --> <div class="form-group"> <label class="col-md-4 control-label" for="checkboxes"></label> <div class="col-md-4"> <div class="checkbox"> <label for="checkboxes-0"> <input type="checkbox" name="checkboxes" id="checkboxes-0" value="1"> Free </label> </div> <div class="checkbox"> <label for="checkboxes-1"> <input type="checkbox" name="checkboxes" id="checkboxes-1" value="2"> Contact Me </label> </div> <div class="checkbox"> <label for="checkboxes-2"> <input type="checkbox" name="checkboxes" id="checkboxes-2" value="3"> Swap or Trade </label> </div> </div> </div> <!-- Multiple Radios --> <div class="form-group"> <label class="col-md-4 control-label" for="for_sale_by">For Sale By</label> <div class="col-md-4"> <div class="radio"> <label for="for_sale_by-0"><input type="radio" name="for_sale_by" id="for_sale_by-0" value="1" checked="checked">Owner</label> </div> <div class="radio"> <label for="for_sale_by-1"><input type="radio" name="for_sale_by" id="for_sale_by-1" value="2">Business</label> </div> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="ad_title">Ad Title</label> <div class="col-md-5"> <input id="ad_title" name="ad_title" type="text" placeholder="" class="form-control input-md"> </div> </div> <!-- Textarea --> <div class="form-group"> <label class="col-md-4 control-label" for="description">Description</label> <div class="col-md-4"> <textarea class="form-control" id="description" name="description"></textarea> </div> </div> <!-- Select Basic --> <div class="form-group"> <label class="col-md-4 control-label" for="municipality">Municipality</label> <div class="col-md-5"> <select id="municipality" name="municipality" class="form-control"> <option value="1">tunapuna</option> <option value="2">chagunaus</option> </select> </div> </div> <!-- Select Basic --> <div class="form-group"> <label class="col-md-4 control-label" for="town">Town</label> <div class="col-md-5"> <select id="town" name="town" class="form-control"> <option value="1">bamboo village</option> <option value="2">warrenville</option> </select> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="address">Address</label> <div class="col-md-5"> <input id="address" name="address" type="text" placeholder="placeholder" class="form-control input-md"> <!-- Address Checkboxes --> <div class="checkbox"> <label for="add-0"> <input type="checkbox" name="add" id="add-0" value="1"> Display address? </label> </div> </div> </div> </fieldset> <fieldset> <legend>Media</legend> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="video">YouTube Video</label> <div class="col-md-5"> <input id="video" name="video" type="text" placeholder="" class="form-control input-md"> <span class="help-block">If you have a video upload it to youtube and post the URL here</span> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="web_url">Website URL</label> <div class="col-md-5"> <input id="web_url" name="web_url" type="text" placeholder="" class="form-control input-md"> <span class="help-block">If you have a website, post the URL here</span> </div> </div> </fieldset> <fieldset> <legend>Contact Information</legend> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="phone_number">Phone Number</label> <div class="col-md-5"> <input id="phone_number" name="phone_number" type="text" placeholder="placeholder" class="form-control input-md"> <span class="help-block">Your phone number will show up on your ad</span> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="email">Email</label> <div class="col-md-5"> <input id="email" name="email" type="text" placeholder="!use static field!" class="form-control input-md"> <span class="help-block">Your e-mail address will not be shared</span> </div> </div> </fieldset> </form> </div> </div>