Jquery 如何在材质样式模板中设计表单获取对齐问题

Jquery 如何在材质样式模板中设计表单获取对齐问题,jquery,twitter-bootstrap,Jquery,Twitter Bootstrap,您好,我试图在材料设计引导模板中设计表单,导致对齐问题。若我将下拉列表和文本输入放在同一行上,但看起来不在同一行中,那个么很难将两个输入字段放在同一行上。 我已经为预期的输出添加了一个图像,下面的fiddle有完整的代码 拨弄 我已经从一些div中删除了row类,对于标签,您使用的是col-md-1类,即不正确,您应该使用col-md-2。我把它改成两个标签。检查以下代码: <div id="ms-preload" class="ms-preload"> <div id=

您好,我试图在材料设计引导模板中设计表单,导致对齐问题。若我将下拉列表和文本输入放在同一行上,但看起来不在同一行中,那个么很难将两个输入字段放在同一行上。 我已经为预期的输出添加了一个图像,下面的fiddle有完整的代码

拨弄


我已经从一些div中删除了row类,对于标签,您使用的是col-md-1类,即不正确,您应该使用col-md-2。我把它改成两个标签。检查以下代码:

<div id="ms-preload" class="ms-preload">
  <div id="status">
    <div class="spinner">
      <div class="dot1"></div>
      <div class="dot2"></div>
    </div>
  </div>
</div>
<div class="bg-full-page bg-primary back-fixed">
  <div class="lw-500 absolute-center">
   <div class="col-md-10 col-md-offset-1 "> 
    <div class="card animated zoomInDown animation-delay-5">
      <div class="card-block">
       <!-- <h4 class="card-title color-primary col-md-10">Tell us more about your Company</h4> -->
        <h4 class="color-primary">Tell us more about your Company</h4>
        <form>
          <fieldset>
          <div class="">
                  <div class="form-group"> 
                    <label for="inputEmail" class="col-md-2 control-label">Company Name</label>                      
                    <div class="col-md-10">
                      <input type="email" class="form-control" id="inputEmail" placeholder="Company Name"> </div>
                  </div>


                  <div class="form-group">     
                   <label for="select111" class="col-md-2 control-label">Select</label>
                    <div class="col-md-10">
                      <select id="select111" class="form-control selectpicker" data-dropup-auto="false">
                        <option>Company Type</option>
                        <option>Connection Design Engineering </option>
                        <option value="Design Assist">Design Assist</option>
                        <option value="Engineering &amp; Consulting">Engineering & Consulting</option>
                       <option value="Fabricators">Fabricators</option>
                       <option value="GC">GC</option>
                       <option value="Erectors">Erectors</option>
                       <option value="Steel Detailing">Steel Detailing</option>
                       <option value="Structural Engineering">Structural Engineering</option>
                      </select>
                    </div>
                  </div>                  
                  </div>

                  <div class="form-group">                       
                    <div class="col-md-10">
                      <input type="email" class="form-control" id="inputEmail" placeholder="Company Official website"> </div>
                  </div>

                       <div class="form-group">                      
                    <div class="col-md-10">
                      <select id="select111" class="form-control selectpicker" data-dropup-auto="false">
                        <option>Phone # Type</option>
                        <option>Connection Design Engineering </option>
                        <option value="Design Assist">Design Assist</option>
                        <option value="Engineering &amp; Consulting">Engineering & Consulting</option>
                       <option value="Fabricators">Fabricators</option>
                       <option value="GC">GC</option>
                       <option value="Erectors">Erectors</option>
                       <option value="Steel Detailing">Steel Detailing</option>
                       <option value="Structural Engineering">Structural Engineering</option>
                      </select>
                    </div>
                  </div>

                  <div class="">
                    <div class="form-group">                       
                    <div class="col-md-3">
                      <input type="email" class="form-control" id="inputEmail" value="+1" readonly> </div>
                      </div>

                      <div class="form-group">     
                      <div class="col-md-5">
                      <input type="email" class="form-control" id="inputEmail" placeholder="Company Phone"> </div>
                      </div>

                       <div class="form-group">  
                      <div class="col-md-2">
                      <input type="email" class="form-control" id="inputEmail" placeholder="Extension"> </div>
                       </div>
                      <div class="col-md-1">
                       <a href="javascript:void(0)" class="btn btn-primary">Add</a></div>

                  </div>

                   <div class="form-group"> 
                   <label class="col-md-6 control-label">Employees</label>                     
                    <div class="col-md-10">
                       <div class="radio radio-primary">
                      <label>
                        <input type="radio" name="optionsRadios" id="optionsRadios1" value="option1" checked="">0-50</label>
                    </div>
                    <div class="radio radio-primary">
                      <label>
                        <input type="radio" name="optionsRadios" id="optionsRadios2" value="option2"> 50-100 </label>
                    </div>
                      <div class="radio radio-primary">
                      <label>
                        <input type="radio" name="optionsRadios" id="optionsRadios3" value="option3"> 100-250 </label>
                    </div>
                      <div class="radio radio-primary">
                      <label>
                        <input type="radio" name="optionsRadios" id="optionsRadios4" value="option4"> 250-500 </label>
                    </div>
                      <div class="radio radio-primary">
                      <label>
                        <input type="radio" name="optionsRadios" id="optionsRadios5" value="option5"> 500-1000 </label>
                    </div>
                      <div class="radio radio-primary">
                      <label>
                        <input type="radio" name="optionsRadios" id="optionsRadios6" value="option6"> above 1000 </label>
                    </div>
                  </div>
                  </div>

                     <div class="form-group">
                    <!-- <label for="inputFile" class="col-md-2 control-label">File</label> -->
                    <div class="col-md-10">
                      <input type="text" readonly="" class="form-control" placeholder="Browse...">
                      <input type="file" id="inputFile" multiple=""> </div>
                  </div>
                  <br/>



                  <!-- ----------------------------------------------------------------------------------------------------------------------------------------------------------- -->
                   <h4 class="card-title color-primary col-md-10">Please enter your company mailing address and different branches your are located at :</h4>

                  <div class="form-group">                      
                    <div class="col-md-10">
                      <select id="select111" class="form-control selectpicker" data-dropup-auto="false">
                        <option>Address Type</option>
                        <option>Connection Design Engineering </option>
                        <option value="Design Assist">Design Assist</option>
                        <option value="Engineering &amp; Consulting">Engineering & Consulting</option>
                       <option value="Fabricators">Fabricators</option>
                       <option value="GC">GC</option>
                       <option value="Erectors">Erectors</option>
                       <option value="Steel Detailing">Steel Detailing</option>
                       <option value="Structural Engineering">Structural Engineering</option>
                      </select>
                    </div>
                  </div>


                  <div class="">
                  <div class="form-group">                      
                    <div class="col-md-5">
                      <select id="select111" class="form-control selectpicker" data-dropup-auto="false">
                        <option>Country</option>
                        <option>Connection Design Engineering </option>
                        <option value="Design Assist">Design Assist</option>
                        <option value="Engineering &amp; Consulting">Engineering & Consulting</option>
                       <option value="Fabricators">Fabricators</option>
                       <option value="GC">GC</option>
                       <option value="Erectors">Erectors</option>
                       <option value="Steel Detailing">Steel Detailing</option>
                       <option value="Structural Engineering">Structural Engineering</option>
                      </select>
                    </div>

                    <div class="form-group"> 
                    <div class="col-md-5">
                      <input type="email" class="form-control" id="inputEmail" placeholder="Zip"> </div>
                      </div>
                  </div>
                  </div>

                  <div class="">
                  <div class="form-group">                      
                    <div class="col-md-5">
                      <select id="select111" class="form-control selectpicker" data-dropup-auto="false">
                        <option>State</option>
                       <option value="Alabama">Alabama</option>
                       <option value="Alaska">Alaska</option>
                       <option value="Arizona">Arizona</option>
                       <option value="Arkansas">Arkansas</option>
                       <option value="California">California</option>
                       <option value="Colorado">Colorado</option>
                       <option value="Connecticut">Connecticut</option>
                        <option value="Delaware">Delaware</option>
                        <option value="Florida">Florida</option>
                        <option value="Georgia">Georgia</option>
                        <option value="Hawaii">Hawaii</option>
                        <option value="Idaho">Idaho</option>
                        <option value="Illinois">Illinois</option>
                        <option value="Indiana">Indiana</option>
                        <option value="Iowa">Iowa</option>
                        <option value="Kansas">Kansas</option>
                        <option value="Kentucky">Kentucky</option>
                        <option value="Louisiana">Louisiana</option>
                        <option value="Maine">Maine</option>
                        <option value="Maryland">Maryland</option>
                        <option value="Massachusetts">Massachusetts</option>
                        <option value="Michigan">Michigan</option>
                        <option value="Minnesota">Minnesota</option>
                        <option value="Mississippi">Mississippi</option>
                        <option value="Missouri">Missouri</option>
                        <option value="Montana">Montana</option>
                        <option value="Nebraska">Nebraska</option>
                        <option value="Nevada">Nevada</option>
                        <option value="New Hampshire">New Hampshire</option>
                        <option value="New Jersey">New Jersey</option>
                        <option value="New Mexico">New Mexico</option>
                        <option value="New York">New York</option>
                        <option value="North Carolina">North Carolina</option>
                        <option value="North Dakota">North Dakota</option>
                        <option value="Ohio">Ohio</option>
                        <option value="Oklahoma">Oklahoma</option>
                        <option value="Oregon">Oregon</option>
                        <option value="Pennsylvania">Pennsylvania</option>
                        <option value="Rhode Island">Rhode Island</option>
                        <option value="South Carolina">South Carolina</option>
                        <option value="South Dakota">South Dakota</option>
                        <option value="Tennessee">Tennessee</option>
                        <option value="Texas">Texas</option>
                        <option value="Utah">Utah</option>
                        <option value="Vermont">Vermont</option>
                        <option value="Virginia">Virginia</option>
                        <option value="Washington">Washington</option>
                        <option value="West Virginia">West Virginia</option>
                        <option value="Wisconsin">Wisconsin</option>
                        <option value="Wyoming">Wyoming</option>
                       </select>
                    </div>
                    </div>
                    <div class="form-group"> 
                            <div class="col-md-5">
                      <select id="select111" class="form-control selectpicker" data-dropup-auto="false">
                        <option>City</option>
                        <option value="Alameda">Alameda</option>
                        <option value="Alhambra">Alhambra</option>
                        <option value="Anaheim">Anaheim</option>
                        <option value="    Antioch">Antioch</option>
                        <option value="    Arcadia">Arcadia</option>
                        <option value="    Bakersfield">Bakersfield</option>
                        <option value="    Barstow">Barstow</option>
                        <option value="    Belmont">Belmont</option>
                        <option value="    Berkeley">Berkeley</option>
                        <option value="    Beverly Hills">Beverly Hills</option>
                        <option value="    Brea">Brea</option>
                        <option value="    Buena Park">Buena Park</option>
                        <option value="    Burbank">Burbank</option>
                        <option value="    Calexico">Calexico</option>
                        <option value="    Calistoga">Calistoga</option>
                        <option value="    Carlsbad">Carlsbad</option>
                        <option value="    Carmel">Carmel</option>
                        <option value="    Chico">Chico</option>
                        <option value="    Chula Vista">Chula Vista</option>
                        <option value="    Claremont">Claremont</option>
                        <option value="    Compton">Compton</option>
                        <option value="    Concord">Concord</option>
                        <option value="    Corona">Corona</option>
                        <option value="    Coronado">Coronado</option>
                        <option value="    Costa Mesa">Costa Mesa</option>
                        <option value="    Culver City">Culver City</option>
                        <option value="    Daly City">Daly City</option>
                        <option value="    Davis">Davis</option>
                        <option value="    Downey">Downey</option>
                        <option value="    El Centro">El Centro</option>
                        <option value="    El Cerrito">El Cerrito</option>
                        <option value="    El Monte">El Monte</option>
                        <option value="    Escondido">Escondido</option>
                        <option value="    Eureka">Eureka</option>
                        <option value="    Fairfield">Fairfield</option>
                        <option value="    Fontana">Fontana</option>
                        <option value="    Fremont">Fremont</option>
                        <option value="    Fresno">Fresno</option>
                        <option value="    Fullerton">Fullerton</option>
                        <option value="    Garden Grove">Garden Grove</option>
                        <option value="    Glendale">Glendale</option>
                        <option value="    Hayward">Hayward</option>
                        <option value="    Hollywood">Hollywood</option>
                        <option value="    Huntington Beach">Huntington Beach</option>
                        <option value="    Indio">Indio</option>
                        <option value="    Inglewood">Inglewood</option>
                        <option value="    Irvine">Irvine</option>
                        <option value="    La Habra">La Habra</option>
                        <option value="    Laguna Beach">Laguna Beach</option>
                        <option value="    Lancaster">&nbsp;&nbsp;&nbsp; Lancaster</option>
                        <option value="    Livermore">&nbsp;&nbsp;&nbsp; Livermore</option>
                        <option value="    Lodi">&nbsp;&nbsp;&nbsp; Lodi</option>
                        <option value="    Lompoc">&nbsp;&nbsp;&nbsp; Lompoc</option>
                        <option value="    Long Beach">&nbsp;&nbsp;&nbsp; Long Beach</option>
                        <option value="    Los Angeles">&nbsp;&nbsp;&nbsp; Los Angeles</option>
                        <option value="    Malibu">&nbsp;&nbsp;&nbsp; Malibu</option>
                        <option value="    Martinez">&nbsp;&nbsp;&nbsp; Martinez</option>
                        <option value="    Marysville">&nbsp;&nbsp;&nbsp; Marysville</option>
                        <option value="    Menlo Park">&nbsp;&nbsp;&nbsp; Menlo Park</option>
                        <option value="    Merced">&nbsp;&nbsp;&nbsp; Merced</option>
                        <option value="    Modesto">&nbsp;&nbsp;&nbsp; Modesto</option>
                        <option value="    Monterey">&nbsp;&nbsp;&nbsp; Monterey</option>
                        <option value="    Mountain View">&nbsp;&nbsp;&nbsp; Mountain View</option>
                        <option value="    Napa">&nbsp;&nbsp;&nbsp; Napa</option>
                        <option value="    Needles">&nbsp;&nbsp;&nbsp; Needles</option>
                        <option value="    Newport Beach">&nbsp;&nbsp;&nbsp; Newport Beach</option>
                        <option value="    Norwalk">&nbsp;&nbsp;&nbsp; Norwalk</option>
                        <option value="    Novato">&nbsp;&nbsp;&nbsp; Novato</option>
                        <option value="    Oakland">&nbsp;&nbsp;&nbsp; Oakland</option>
                        <option value="    Oceanside">&nbsp;&nbsp;&nbsp; Oceanside</option>
                        <option value="    Ojai">&nbsp;&nbsp;&nbsp; Ojai</option>
                        <option value="    Ontario">&nbsp;&nbsp;&nbsp; Ontario</option>
                        <option value="    Orange">&nbsp;&nbsp;&nbsp; Orange</option>
                        <option value="    Oroville">&nbsp;&nbsp;&nbsp; Oroville</option>
                        <option value="    Oxnard">&nbsp;&nbsp;&nbsp; Oxnard</option>
                        <option value="    Pacific Grove">&nbsp;&nbsp;&nbsp; Pacific Grove</option>
                        <option value="    Palm Springs">&nbsp;&nbsp;&nbsp; Palm Springs</option>
                        <option value="    Palmdale">&nbsp;&nbsp;&nbsp; Palmdale</option>
                        <option value="    Palo Alto">&nbsp;&nbsp;&nbsp; Palo Alto</option>
                        <option value="    Pasadena">&nbsp;&nbsp;&nbsp; Pasadena</option>
                        <option value="    Petaluma">&nbsp;&nbsp;&nbsp; Petaluma</option>
                        <option value="    Pomona">&nbsp;&nbsp;&nbsp; Pomona</option>
                        <option value="    Port Hueneme">&nbsp;&nbsp;&nbsp; Port Hueneme</option>
                        <option value="    Rancho Cucamonga">&nbsp;&nbsp;&nbsp; Rancho Cucamonga</option>
                        <option value="    Red Bluff">&nbsp;&nbsp;&nbsp; Red Bluff</option>
                        <option value="    Redding">&nbsp;&nbsp;&nbsp; Redding</option>
                        <option value="    Redlands">&nbsp;&nbsp;&nbsp; Redlands</option>
                        <option value="    Redondo Beach">&nbsp;&nbsp;&nbsp; Redondo Beach</option>
                        <option value="    Redwood City">&nbsp;&nbsp;&nbsp; Redwood City</option>
                        <option value="    Richmond">&nbsp;&nbsp;&nbsp; Richmond</option>
                        <option value="    Riverside">&nbsp;&nbsp;&nbsp; Riverside</option>
                        <option value="    Roseville">&nbsp;&nbsp;&nbsp; Roseville</option>
                        <option value="    Sacramento">&nbsp;&nbsp;&nbsp; Sacramento</option>
                        <option value="    Salinas">&nbsp;&nbsp;&nbsp; Salinas</option>
                        <option value="    San Bernardino">&nbsp;&nbsp;&nbsp; San Bernardino</option>
                        <option value="    San Clemente">&nbsp;&nbsp;&nbsp; San Clemente</option>
                        <option value="    San Diego">&nbsp;&nbsp;&nbsp; San Diego</option>
                        <option value="    San Fernando">&nbsp;&nbsp;&nbsp; San Fernando</option>
                        <option value="    San Francisco">&nbsp;&nbsp;&nbsp; San Francisco</option>
                        <option value="    San Gabriel">&nbsp;&nbsp;&nbsp; San Gabriel</option>
                        <option value="    San Jose">&nbsp;&nbsp;&nbsp; San Jose</option>
                        <option value="    San Juan Capistrano">&nbsp;&nbsp;&nbsp; San Juan Capistrano</option>
                        <option value="    San Leandro">&nbsp;&nbsp;&nbsp; San Leandro</option>
                        <option value="    San Luis Obispo">&nbsp;&nbsp;&nbsp; San Luis Obispo</option>
                        <option value="    San Marino">&nbsp;&nbsp;&nbsp; San Marino</option>
                        <option value="    San Mateo">&nbsp;&nbsp;&nbsp; San Mateo</option>
                        <option value="    San Pedro">&nbsp;&nbsp;&nbsp; San Pedro</option>
                        <option value="    San Rafael">&nbsp;&nbsp;&nbsp; San Rafael</option>
                        <option value="    San Simeon">&nbsp;&nbsp;&nbsp; San Simeon</option>
                        <option value="    Santa Ana">&nbsp;&nbsp;&nbsp; Santa Ana</option>
                        <option value="    Santa Barbara">&nbsp;&nbsp;&nbsp; Santa Barbara</option>
                        <option value="    Santa Clara">&nbsp;&nbsp;&nbsp; Santa Clara</option>
                        <option value="    Santa Clarita">&nbsp;&nbsp;&nbsp; Santa Clarita</option>
                        <option value="    Santa Cruz">&nbsp;&nbsp;&nbsp; Santa Cruz</option>
                        <option value="    Santa Monica">&nbsp;&nbsp;&nbsp; Santa Monica</option>
                        <option value="    Santa Rosa">&nbsp;&nbsp;&nbsp; Santa Rosa</option>
                        <option value="    Sausalito">&nbsp;&nbsp;&nbsp; Sausalito</option>
                        <option value="    Simi Valley">&nbsp;&nbsp;&nbsp; Simi Valley</option>
                        <option value="    Sonoma">&nbsp;&nbsp;&nbsp; Sonoma</option>
                        <option value="    South San Francisco">&nbsp;&nbsp;&nbsp; South San Francisco</option>
                        <option value="    Stockton">&nbsp;&nbsp;&nbsp; Stockton</option>
                        <option value="    Sunnyvale">&nbsp;&nbsp;&nbsp; Sunnyvale</option>
                        <option value="    Susanville">Susanville</option>
                        <option value="    Thousand Oaks">Thousand Oaks</option>
                        <option value="    Torrance">Torrance</option>
                        <option value="    Turlock">Turlock</option>
                        <option value="    Ukiah">Ukiah</option>
                        <option value="    Vallejo">Vallejo</option>
                        <option value="    Ventura">Ventura</option>
                        <option value="    Victorville">Victorville</option>
                        <option value="    Visalia">Visalia</option>
                        <option value="    Walnut Creek">Walnut Creek</option>
                        <option value="    Watts">Watts</option>
                        <option value="    West Covina">West Covina</option>
                        <option value="    Whittier">Whittier</option>
                        <option value="    Woodland">Woodland</option>
                        <option value="    Yorba Linda">Yorba Linda</option>
                        <option value="    Yuba City">Yuba City</option>
                        </select>
                        </div>  
                    </div>                              

                </div>

                      <div class="form-group">                       
                    <div class="col-md-10">
                      <input type="email" class="form-control" id="inputEmail" placeholder="Street"> </div>
                  </div>          

                <div class="">
              <div class="col-md-2 col-md-offset-2">
                <button class="btn btn-raised btn-primary btn-block">Submit

                </button>
              </div>

              <div class="col-md-2 col-md-offset-2">
                <button class="btn btn-raised btn-block">
                  Cancel</button>
              </div>
            </div>

          </fieldset>
        </form>

      </div>
    </div>
   </div>
  </div>
</div>

您没有正确使用引导类

如果希望元素显示在一行中,则行应包含两个6级列类和表单组表单组col-md-6元素。下面是一行中的输入和下拉列表示例。此外,您的下拉列表有一个btn组类,该类具有边距,这使得它看起来与输入有点不同。这里有一个指向小提琴的链接,我在这里固定了第一行,并从btn组类中删除了边距


你的建议是对的。。你能分享你的邮件id吗?当我完成这个表单设计时,我会有信心做进一步的工作。我不能在这里分享我的电子邮件地址,原因很明显。如果你能把它放在github和share链接上,我会连接到那里。你有位bucket Account吗?我从第一次看到这个fiddle它不工作开始,在表单组上使用col-md-6类,并添加边距:0;to.btn组
<div id="ms-preload" class="ms-preload">
  <div id="status">
    <div class="spinner">
      <div class="dot1"></div>
      <div class="dot2"></div>
    </div>
  </div>
</div>
<div class="bg-full-page bg-primary back-fixed">
  <div class="lw-500 absolute-center">
   <div class="col-md-10 col-md-offset-1 "> 
    <div class="card animated zoomInDown animation-delay-5">
      <div class="card-block">
       <!-- <h4 class="card-title color-primary col-md-10">Tell us more about your Company</h4> -->
        <h4 class="color-primary">Tell us more about your Company</h4>
        <form>
          <fieldset>
          <div class="">
                  <div class="form-group"> 
                    <label for="inputEmail" class="col-md-2 control-label">Company Name</label>                      
                    <div class="col-md-10">
                      <input type="email" class="form-control" id="inputEmail" placeholder="Company Name"> </div>
                  </div>


                  <div class="form-group">     
                   <label for="select111" class="col-md-2 control-label">Select</label>
                    <div class="col-md-10">
                      <select id="select111" class="form-control selectpicker" data-dropup-auto="false">
                        <option>Company Type</option>
                        <option>Connection Design Engineering </option>
                        <option value="Design Assist">Design Assist</option>
                        <option value="Engineering &amp; Consulting">Engineering & Consulting</option>
                       <option value="Fabricators">Fabricators</option>
                       <option value="GC">GC</option>
                       <option value="Erectors">Erectors</option>
                       <option value="Steel Detailing">Steel Detailing</option>
                       <option value="Structural Engineering">Structural Engineering</option>
                      </select>
                    </div>
                  </div>                  
                  </div>

                  <div class="form-group">                       
                    <div class="col-md-10">
                      <input type="email" class="form-control" id="inputEmail" placeholder="Company Official website"> </div>
                  </div>

                       <div class="form-group">                      
                    <div class="col-md-10">
                      <select id="select111" class="form-control selectpicker" data-dropup-auto="false">
                        <option>Phone # Type</option>
                        <option>Connection Design Engineering </option>
                        <option value="Design Assist">Design Assist</option>
                        <option value="Engineering &amp; Consulting">Engineering & Consulting</option>
                       <option value="Fabricators">Fabricators</option>
                       <option value="GC">GC</option>
                       <option value="Erectors">Erectors</option>
                       <option value="Steel Detailing">Steel Detailing</option>
                       <option value="Structural Engineering">Structural Engineering</option>
                      </select>
                    </div>
                  </div>

                  <div class="">
                    <div class="form-group">                       
                    <div class="col-md-3">
                      <input type="email" class="form-control" id="inputEmail" value="+1" readonly> </div>
                      </div>

                      <div class="form-group">     
                      <div class="col-md-5">
                      <input type="email" class="form-control" id="inputEmail" placeholder="Company Phone"> </div>
                      </div>

                       <div class="form-group">  
                      <div class="col-md-2">
                      <input type="email" class="form-control" id="inputEmail" placeholder="Extension"> </div>
                       </div>
                      <div class="col-md-1">
                       <a href="javascript:void(0)" class="btn btn-primary">Add</a></div>

                  </div>

                   <div class="form-group"> 
                   <label class="col-md-6 control-label">Employees</label>                     
                    <div class="col-md-10">
                       <div class="radio radio-primary">
                      <label>
                        <input type="radio" name="optionsRadios" id="optionsRadios1" value="option1" checked="">0-50</label>
                    </div>
                    <div class="radio radio-primary">
                      <label>
                        <input type="radio" name="optionsRadios" id="optionsRadios2" value="option2"> 50-100 </label>
                    </div>
                      <div class="radio radio-primary">
                      <label>
                        <input type="radio" name="optionsRadios" id="optionsRadios3" value="option3"> 100-250 </label>
                    </div>
                      <div class="radio radio-primary">
                      <label>
                        <input type="radio" name="optionsRadios" id="optionsRadios4" value="option4"> 250-500 </label>
                    </div>
                      <div class="radio radio-primary">
                      <label>
                        <input type="radio" name="optionsRadios" id="optionsRadios5" value="option5"> 500-1000 </label>
                    </div>
                      <div class="radio radio-primary">
                      <label>
                        <input type="radio" name="optionsRadios" id="optionsRadios6" value="option6"> above 1000 </label>
                    </div>
                  </div>
                  </div>

                     <div class="form-group">
                    <!-- <label for="inputFile" class="col-md-2 control-label">File</label> -->
                    <div class="col-md-10">
                      <input type="text" readonly="" class="form-control" placeholder="Browse...">
                      <input type="file" id="inputFile" multiple=""> </div>
                  </div>
                  <br/>



                  <!-- ----------------------------------------------------------------------------------------------------------------------------------------------------------- -->
                   <h4 class="card-title color-primary col-md-10">Please enter your company mailing address and different branches your are located at :</h4>

                  <div class="form-group">                      
                    <div class="col-md-10">
                      <select id="select111" class="form-control selectpicker" data-dropup-auto="false">
                        <option>Address Type</option>
                        <option>Connection Design Engineering </option>
                        <option value="Design Assist">Design Assist</option>
                        <option value="Engineering &amp; Consulting">Engineering & Consulting</option>
                       <option value="Fabricators">Fabricators</option>
                       <option value="GC">GC</option>
                       <option value="Erectors">Erectors</option>
                       <option value="Steel Detailing">Steel Detailing</option>
                       <option value="Structural Engineering">Structural Engineering</option>
                      </select>
                    </div>
                  </div>


                  <div class="">
                  <div class="form-group">                      
                    <div class="col-md-5">
                      <select id="select111" class="form-control selectpicker" data-dropup-auto="false">
                        <option>Country</option>
                        <option>Connection Design Engineering </option>
                        <option value="Design Assist">Design Assist</option>
                        <option value="Engineering &amp; Consulting">Engineering & Consulting</option>
                       <option value="Fabricators">Fabricators</option>
                       <option value="GC">GC</option>
                       <option value="Erectors">Erectors</option>
                       <option value="Steel Detailing">Steel Detailing</option>
                       <option value="Structural Engineering">Structural Engineering</option>
                      </select>
                    </div>

                    <div class="form-group"> 
                    <div class="col-md-5">
                      <input type="email" class="form-control" id="inputEmail" placeholder="Zip"> </div>
                      </div>
                  </div>
                  </div>

                  <div class="">
                  <div class="form-group">                      
                    <div class="col-md-5">
                      <select id="select111" class="form-control selectpicker" data-dropup-auto="false">
                        <option>State</option>
                       <option value="Alabama">Alabama</option>
                       <option value="Alaska">Alaska</option>
                       <option value="Arizona">Arizona</option>
                       <option value="Arkansas">Arkansas</option>
                       <option value="California">California</option>
                       <option value="Colorado">Colorado</option>
                       <option value="Connecticut">Connecticut</option>
                        <option value="Delaware">Delaware</option>
                        <option value="Florida">Florida</option>
                        <option value="Georgia">Georgia</option>
                        <option value="Hawaii">Hawaii</option>
                        <option value="Idaho">Idaho</option>
                        <option value="Illinois">Illinois</option>
                        <option value="Indiana">Indiana</option>
                        <option value="Iowa">Iowa</option>
                        <option value="Kansas">Kansas</option>
                        <option value="Kentucky">Kentucky</option>
                        <option value="Louisiana">Louisiana</option>
                        <option value="Maine">Maine</option>
                        <option value="Maryland">Maryland</option>
                        <option value="Massachusetts">Massachusetts</option>
                        <option value="Michigan">Michigan</option>
                        <option value="Minnesota">Minnesota</option>
                        <option value="Mississippi">Mississippi</option>
                        <option value="Missouri">Missouri</option>
                        <option value="Montana">Montana</option>
                        <option value="Nebraska">Nebraska</option>
                        <option value="Nevada">Nevada</option>
                        <option value="New Hampshire">New Hampshire</option>
                        <option value="New Jersey">New Jersey</option>
                        <option value="New Mexico">New Mexico</option>
                        <option value="New York">New York</option>
                        <option value="North Carolina">North Carolina</option>
                        <option value="North Dakota">North Dakota</option>
                        <option value="Ohio">Ohio</option>
                        <option value="Oklahoma">Oklahoma</option>
                        <option value="Oregon">Oregon</option>
                        <option value="Pennsylvania">Pennsylvania</option>
                        <option value="Rhode Island">Rhode Island</option>
                        <option value="South Carolina">South Carolina</option>
                        <option value="South Dakota">South Dakota</option>
                        <option value="Tennessee">Tennessee</option>
                        <option value="Texas">Texas</option>
                        <option value="Utah">Utah</option>
                        <option value="Vermont">Vermont</option>
                        <option value="Virginia">Virginia</option>
                        <option value="Washington">Washington</option>
                        <option value="West Virginia">West Virginia</option>
                        <option value="Wisconsin">Wisconsin</option>
                        <option value="Wyoming">Wyoming</option>
                       </select>
                    </div>
                    </div>
                    <div class="form-group"> 
                            <div class="col-md-5">
                      <select id="select111" class="form-control selectpicker" data-dropup-auto="false">
                        <option>City</option>
                        <option value="Alameda">Alameda</option>
                        <option value="Alhambra">Alhambra</option>
                        <option value="Anaheim">Anaheim</option>
                        <option value="    Antioch">Antioch</option>
                        <option value="    Arcadia">Arcadia</option>
                        <option value="    Bakersfield">Bakersfield</option>
                        <option value="    Barstow">Barstow</option>
                        <option value="    Belmont">Belmont</option>
                        <option value="    Berkeley">Berkeley</option>
                        <option value="    Beverly Hills">Beverly Hills</option>
                        <option value="    Brea">Brea</option>
                        <option value="    Buena Park">Buena Park</option>
                        <option value="    Burbank">Burbank</option>
                        <option value="    Calexico">Calexico</option>
                        <option value="    Calistoga">Calistoga</option>
                        <option value="    Carlsbad">Carlsbad</option>
                        <option value="    Carmel">Carmel</option>
                        <option value="    Chico">Chico</option>
                        <option value="    Chula Vista">Chula Vista</option>
                        <option value="    Claremont">Claremont</option>
                        <option value="    Compton">Compton</option>
                        <option value="    Concord">Concord</option>
                        <option value="    Corona">Corona</option>
                        <option value="    Coronado">Coronado</option>
                        <option value="    Costa Mesa">Costa Mesa</option>
                        <option value="    Culver City">Culver City</option>
                        <option value="    Daly City">Daly City</option>
                        <option value="    Davis">Davis</option>
                        <option value="    Downey">Downey</option>
                        <option value="    El Centro">El Centro</option>
                        <option value="    El Cerrito">El Cerrito</option>
                        <option value="    El Monte">El Monte</option>
                        <option value="    Escondido">Escondido</option>
                        <option value="    Eureka">Eureka</option>
                        <option value="    Fairfield">Fairfield</option>
                        <option value="    Fontana">Fontana</option>
                        <option value="    Fremont">Fremont</option>
                        <option value="    Fresno">Fresno</option>
                        <option value="    Fullerton">Fullerton</option>
                        <option value="    Garden Grove">Garden Grove</option>
                        <option value="    Glendale">Glendale</option>
                        <option value="    Hayward">Hayward</option>
                        <option value="    Hollywood">Hollywood</option>
                        <option value="    Huntington Beach">Huntington Beach</option>
                        <option value="    Indio">Indio</option>
                        <option value="    Inglewood">Inglewood</option>
                        <option value="    Irvine">Irvine</option>
                        <option value="    La Habra">La Habra</option>
                        <option value="    Laguna Beach">Laguna Beach</option>
                        <option value="    Lancaster">&nbsp;&nbsp;&nbsp; Lancaster</option>
                        <option value="    Livermore">&nbsp;&nbsp;&nbsp; Livermore</option>
                        <option value="    Lodi">&nbsp;&nbsp;&nbsp; Lodi</option>
                        <option value="    Lompoc">&nbsp;&nbsp;&nbsp; Lompoc</option>
                        <option value="    Long Beach">&nbsp;&nbsp;&nbsp; Long Beach</option>
                        <option value="    Los Angeles">&nbsp;&nbsp;&nbsp; Los Angeles</option>
                        <option value="    Malibu">&nbsp;&nbsp;&nbsp; Malibu</option>
                        <option value="    Martinez">&nbsp;&nbsp;&nbsp; Martinez</option>
                        <option value="    Marysville">&nbsp;&nbsp;&nbsp; Marysville</option>
                        <option value="    Menlo Park">&nbsp;&nbsp;&nbsp; Menlo Park</option>
                        <option value="    Merced">&nbsp;&nbsp;&nbsp; Merced</option>
                        <option value="    Modesto">&nbsp;&nbsp;&nbsp; Modesto</option>
                        <option value="    Monterey">&nbsp;&nbsp;&nbsp; Monterey</option>
                        <option value="    Mountain View">&nbsp;&nbsp;&nbsp; Mountain View</option>
                        <option value="    Napa">&nbsp;&nbsp;&nbsp; Napa</option>
                        <option value="    Needles">&nbsp;&nbsp;&nbsp; Needles</option>
                        <option value="    Newport Beach">&nbsp;&nbsp;&nbsp; Newport Beach</option>
                        <option value="    Norwalk">&nbsp;&nbsp;&nbsp; Norwalk</option>
                        <option value="    Novato">&nbsp;&nbsp;&nbsp; Novato</option>
                        <option value="    Oakland">&nbsp;&nbsp;&nbsp; Oakland</option>
                        <option value="    Oceanside">&nbsp;&nbsp;&nbsp; Oceanside</option>
                        <option value="    Ojai">&nbsp;&nbsp;&nbsp; Ojai</option>
                        <option value="    Ontario">&nbsp;&nbsp;&nbsp; Ontario</option>
                        <option value="    Orange">&nbsp;&nbsp;&nbsp; Orange</option>
                        <option value="    Oroville">&nbsp;&nbsp;&nbsp; Oroville</option>
                        <option value="    Oxnard">&nbsp;&nbsp;&nbsp; Oxnard</option>
                        <option value="    Pacific Grove">&nbsp;&nbsp;&nbsp; Pacific Grove</option>
                        <option value="    Palm Springs">&nbsp;&nbsp;&nbsp; Palm Springs</option>
                        <option value="    Palmdale">&nbsp;&nbsp;&nbsp; Palmdale</option>
                        <option value="    Palo Alto">&nbsp;&nbsp;&nbsp; Palo Alto</option>
                        <option value="    Pasadena">&nbsp;&nbsp;&nbsp; Pasadena</option>
                        <option value="    Petaluma">&nbsp;&nbsp;&nbsp; Petaluma</option>
                        <option value="    Pomona">&nbsp;&nbsp;&nbsp; Pomona</option>
                        <option value="    Port Hueneme">&nbsp;&nbsp;&nbsp; Port Hueneme</option>
                        <option value="    Rancho Cucamonga">&nbsp;&nbsp;&nbsp; Rancho Cucamonga</option>
                        <option value="    Red Bluff">&nbsp;&nbsp;&nbsp; Red Bluff</option>
                        <option value="    Redding">&nbsp;&nbsp;&nbsp; Redding</option>
                        <option value="    Redlands">&nbsp;&nbsp;&nbsp; Redlands</option>
                        <option value="    Redondo Beach">&nbsp;&nbsp;&nbsp; Redondo Beach</option>
                        <option value="    Redwood City">&nbsp;&nbsp;&nbsp; Redwood City</option>
                        <option value="    Richmond">&nbsp;&nbsp;&nbsp; Richmond</option>
                        <option value="    Riverside">&nbsp;&nbsp;&nbsp; Riverside</option>
                        <option value="    Roseville">&nbsp;&nbsp;&nbsp; Roseville</option>
                        <option value="    Sacramento">&nbsp;&nbsp;&nbsp; Sacramento</option>
                        <option value="    Salinas">&nbsp;&nbsp;&nbsp; Salinas</option>
                        <option value="    San Bernardino">&nbsp;&nbsp;&nbsp; San Bernardino</option>
                        <option value="    San Clemente">&nbsp;&nbsp;&nbsp; San Clemente</option>
                        <option value="    San Diego">&nbsp;&nbsp;&nbsp; San Diego</option>
                        <option value="    San Fernando">&nbsp;&nbsp;&nbsp; San Fernando</option>
                        <option value="    San Francisco">&nbsp;&nbsp;&nbsp; San Francisco</option>
                        <option value="    San Gabriel">&nbsp;&nbsp;&nbsp; San Gabriel</option>
                        <option value="    San Jose">&nbsp;&nbsp;&nbsp; San Jose</option>
                        <option value="    San Juan Capistrano">&nbsp;&nbsp;&nbsp; San Juan Capistrano</option>
                        <option value="    San Leandro">&nbsp;&nbsp;&nbsp; San Leandro</option>
                        <option value="    San Luis Obispo">&nbsp;&nbsp;&nbsp; San Luis Obispo</option>
                        <option value="    San Marino">&nbsp;&nbsp;&nbsp; San Marino</option>
                        <option value="    San Mateo">&nbsp;&nbsp;&nbsp; San Mateo</option>
                        <option value="    San Pedro">&nbsp;&nbsp;&nbsp; San Pedro</option>
                        <option value="    San Rafael">&nbsp;&nbsp;&nbsp; San Rafael</option>
                        <option value="    San Simeon">&nbsp;&nbsp;&nbsp; San Simeon</option>
                        <option value="    Santa Ana">&nbsp;&nbsp;&nbsp; Santa Ana</option>
                        <option value="    Santa Barbara">&nbsp;&nbsp;&nbsp; Santa Barbara</option>
                        <option value="    Santa Clara">&nbsp;&nbsp;&nbsp; Santa Clara</option>
                        <option value="    Santa Clarita">&nbsp;&nbsp;&nbsp; Santa Clarita</option>
                        <option value="    Santa Cruz">&nbsp;&nbsp;&nbsp; Santa Cruz</option>
                        <option value="    Santa Monica">&nbsp;&nbsp;&nbsp; Santa Monica</option>
                        <option value="    Santa Rosa">&nbsp;&nbsp;&nbsp; Santa Rosa</option>
                        <option value="    Sausalito">&nbsp;&nbsp;&nbsp; Sausalito</option>
                        <option value="    Simi Valley">&nbsp;&nbsp;&nbsp; Simi Valley</option>
                        <option value="    Sonoma">&nbsp;&nbsp;&nbsp; Sonoma</option>
                        <option value="    South San Francisco">&nbsp;&nbsp;&nbsp; South San Francisco</option>
                        <option value="    Stockton">&nbsp;&nbsp;&nbsp; Stockton</option>
                        <option value="    Sunnyvale">&nbsp;&nbsp;&nbsp; Sunnyvale</option>
                        <option value="    Susanville">Susanville</option>
                        <option value="    Thousand Oaks">Thousand Oaks</option>
                        <option value="    Torrance">Torrance</option>
                        <option value="    Turlock">Turlock</option>
                        <option value="    Ukiah">Ukiah</option>
                        <option value="    Vallejo">Vallejo</option>
                        <option value="    Ventura">Ventura</option>
                        <option value="    Victorville">Victorville</option>
                        <option value="    Visalia">Visalia</option>
                        <option value="    Walnut Creek">Walnut Creek</option>
                        <option value="    Watts">Watts</option>
                        <option value="    West Covina">West Covina</option>
                        <option value="    Whittier">Whittier</option>
                        <option value="    Woodland">Woodland</option>
                        <option value="    Yorba Linda">Yorba Linda</option>
                        <option value="    Yuba City">Yuba City</option>
                        </select>
                        </div>  
                    </div>                              

                </div>

                      <div class="form-group">                       
                    <div class="col-md-10">
                      <input type="email" class="form-control" id="inputEmail" placeholder="Street"> </div>
                  </div>          

                <div class="">
              <div class="col-md-2 col-md-offset-2">
                <button class="btn btn-raised btn-primary btn-block">Submit

                </button>
              </div>

              <div class="col-md-2 col-md-offset-2">
                <button class="btn btn-raised btn-block">
                  Cancel</button>
              </div>
            </div>

          </fieldset>
        </form>

      </div>
    </div>
   </div>
  </div>
</div>
<div class="row">

              <div class="form-group col-md-6">                                    
                   <label for="inputEmail" class="control-label">Company Name</label>  
                  <input type="email" class="form-control" id="inputEmail" placeholder="Company Name"> 
                </div>

                <div class="form-group col-md-6">
                  <label for="select111" class=" control-label">Select</label>
                  <select id="select111" class="form-control selectpicker" data-dropup-auto="false">
                    <option>Company Type</option>
                    <option>Connection Design Engineering </option>
                    <option value="Design Assist">Design Assist</option>
                    <option value="Engineering &amp; Consulting">Engineering & Consulting</option>
                   <option value="Fabricators">Fabricators</option>
                   <option value="GC">GC</option>
                   <option value="Erectors">Erectors</option>
                   <option value="Steel Detailing">Steel Detailing</option>
                   <option value="Structural Engineering">Structural Engineering</option>
                  </select>
                </div>


    </div>