CSS：Django的按鈕和搜索欄在線

我有這個網站在Django模板：CSS：Django的按鈕和搜索欄在線

<div id = "search_form"> 
     <form action="" method="get" id = "search-form"> 
      {% csrf_token %} 
      {{ form.as_p }} 
      {{ form.media }} 
     </form> 
     <button class="btn btn-primary" id="search_submit" name = "search_submit" type="submit" value = "submit" ><span class="glyphicon glyphicon-search"></span></button> 
</div>

如何讓搜索欄和按鈕內嵌？這是行不通的：

#search_submit { 
    display: inline; 
}

來源

2017-02-03 Irmantas Želionis

沒有用於在HTML中搜索的輸入。它是由django渲染的嗎？你能告訴我們完整的HTML嗎？ –

是的，它是由{{form.as_p}} –

由於您使用的引導，試試這個（順便說一句，按鈕的形式應該標籤內）：

<div id = "search_form"> 
    <form action="" method="get" id = "search-form"> 
    {% csrf_token %} 

    <div class="col-xs-6"> 
    {{ form.as_p }} 
    {{ form.media }} 
    </div> 
    <div class="col-xs-6"> 
     <button class="btn btn-primary" id="search_submit" name = "search_submit" type="submit" value = "submit" ><span class="glyphicon glyphicon-search"></span></button> 
    </div> 
    </form> 
</div>

來源

2017-02-03 12:55:42

呈現比kinda以某種方式工作。現在所有東西都是一條線，但是彼此距離很遠 –

嘗試使用col值（例如， col-xs-9和col-xs-3 –

謝謝。我不得不稍微更新一下你的代碼，但是你讓我走上了正確的道路 –

奏效的解決方案：

<div id = "search_form"> 
    <div class="input-group"> 
     <form action="" method="get" id = "search-form"> 
      {% csrf_token %} 

      <div class="col-xs-6"> 
       {{ form.as_p }} 
       {{ form.media }} 
      </div> 
      <div class="col-xs-6"> 
       <span class="input-group-btn"> 
        <button class="btn btn-primary" id="search_submit" name = "search_submit" type="submit" value = "submit" ><span class="glyphicon glyphicon-search"></span></button> 
       </span> 
      </div> 
     </form> 
    </div> 
</div>

來源

2017-02-03 13:22:30

CSS：Django的按鈕和搜索欄在線

回答

相關問題