HTML/CSS兩個相鄰的搜索框

我試圖創建一個搜索欄，就像會在yelp上找到的那樣。兩個酒吧並排居中。根據下面的代碼，我無法讓他們居中。我的想法是創建兩列，並肩並排，一個拉向右，另一個離開，但我沒有太多的運氣。有什麼建議？HTML/CSS兩個相鄰的搜索框

<HTML> 
<form> 
    <div class="row"> 
     <div class="col-sm-5 portfolio-item"> 
      <div class="input-group" display="inline"> 
       <input id="searchone" name="search" type="search" value="<?php echo $search_word;?>" class="form-control" placeholder="Name"> 
      </div> 
     </div> 

     <div class="col-sm-5 portfolio-item"> 
      <div class="input-group" display="inline"> 
       <input id="searchtwo" name="search" type="search" value="<?php echo $search_word;?>" class="form-control" placeholder="Location"> 
      <div class="input-group-btn"> 
       <button class="btn btn-default btn" name="submit" type="submit"> 
        <span id="glyph" class="glyphicon glyphicon-search" name="submit"></span> 
       </button>  
      </div> 
     </div> 
    </div> 
    <!-- /.row -->

<CSS> 
.row .col-sm-5 .input-group .form-control{ 
width:300px; 
float:center;}

來源

2015-11-22 Lauren

'center'不是VAL 'float'的id屬性。 –

這可能會幫助你

HTML

<div class="row"> 
    <div class="col-sm-5 col-sm-offset-1 portfolio-item"> 
     <div class="input-group" display="inline"> 
      <input id="searchone" name="search" type="search" value="<?php echo $search_word;?>" class="form-control" placeholder="Name"> 
     </div> 
    </div> 
    <div class="col-sm-5 col-sm-pull-1 portfolio-item"> 
     <div class="input-group" display="inline"> 
      <input id="searchtwo" name="search" type="search" value="<?php echo $search_word;?>" class="form-control" placeholder="Location"> 
      <div class="input-group-btn"> 
       <button class="btn btn-default btn" name="submit" type="submit"> <span id="glyph" class="glyphicon glyphicon-search" name="submit"></span> 

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

小提琴here

來源

2015-11-22 03:46:45 Raviteja

HTML/CSS兩個相鄰的搜索框

回答

相關問題