如何修復Bootstrap中的重疊輸入2

我在輸入框相互重疊時出現問題，因爲屏幕開始縮小寬度。有沒有辦法解決這個引導2文件或直接調整內聯的CSS？如何修復Bootstrap中的重疊輸入2

這裏是保存內容的主頁。

<div class="content-center"> 
<div class="container"> 
    <div class="row-fluid"> 
     <div class="span9"> 
      <div class="content-area"> 

      //WHERE CONTENT IS LIVING 


      </div> 
     </div> 
     <div class="span3"> 
      <div class="sidebar"> 
       <div class="content-area"> 

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

這裏是內容所在的實際代碼。

<div class="well"> 
<div class="row-fluid"> 

<div class="span4"> 

<h4>Dinner Banquet w Cocktail Reception Total:</h4> 

<div class="input-prepend"> 
<span class="add-on" style="font-size:24px;">$</span><INPUT NAME="xbrunchdinneronlytotal" TYPE="text" style="font-weight:bold; font-size:18px; color:#2e713b; background-color:#ffffff;" onKeyUp="javascript:getbrunchdinnertotal(this);" value="0" > 
</div> 


</div> 

<div class="span4"> 
<h4>Wine Tour:</h4> 

<div class="input-prepend"> 
<span class="add-on" style="font-size:18px;">Qty</span> 
<input type="text" name="xwinetouronly" onKeyUp="javascript:getwinetouronlytotal(this);" placeholder="Enter Quantity"> 
</div> 

<h4>Total:</h4> 

<div class="input-prepend"> 
<span class="add-on" style="font-size:24px;">$</span> 
<INPUT NAME="xwinetouronlytotal" TYPE="text" style="font-weight:bold; font-size:18px; color:#2e713b; background-color:#ffffff;" onKeyUp="javascript:getwinetouronlytotal(this);" value="0"></div> 

</div> 

<div class="span4"> 

<h4>Exhibit Fee:</h4> 
<div class="input-prepend"> 
<span class="add-on" style="font-size:24px;">$</span> 
<INPUT NAME="xhibittotal" TYPE="text" style="font-weight:bold; font-size:18px; color:#2e713b; background-color:#ffffff;" onKeyUp="javascript:getgolftotal(this);" value="0" > 
</div> 


</div> 

</div> 
</div>

這裏是1199px

瀏覽器的寬度在這裏是979px

瀏覽器寬度那麼，有沒有辦法解決這個問題。我知道我可以在自己的自定義CSS中弄亂媒體查詢，但是我也想知道我是否可以在引導2源文件中解決這個問題。，或直接使用內聯CSS

來源

2017-09-02 Carlitos

把所有的投入解決這一問題變成大和meduim屏幕上列

<div col-lg-4 col-lg-4 col-sm-12 col-sm-12> Dinner Banuqet //input field </div> <div col-lg-4 col-lg-4 col-sm-12 col-sm-12> Wine Tour //input field </div> <div col-lg-4 col-lg-4 col-sm-12 col-sm-12> Exhibit Fee //input field </div> 將有3列與內容佔據整個屏幕。在小型和超小型屏幕上，內容將垂直對齊。你可以直接添加cols到你的input-append類

來源

2017-09-02 19:27:44 DPalmquist

這不是引導3嗎？ – Carlitos

是的，我沒有看到它是bootstrap 2 – DPalmquist

如何修復Bootstrap中的重疊輸入2

回答

相關問題