Bootstrap在輸入文本框旁邊放置星號

我使用的是引導網格系統，我想知道如何在沒有太多間距的情況下在我的輸入框（右側）放置紅色星號。將輸入框顯示爲必需。Bootstrap在輸入文本框旁邊放置星號

我無法弄清bootstraps gird系統這樣做。我試圖把它作爲標籤，但它把它放在上面。作爲一個跨度它把它放在下面。我怎樣才能把這個恰好置於輸入之後？

<div id="propertyidsearch"> 
     <div class="col-lg-3 required"> 
      <input type="text" name="searchValue" maxlength="2000" size="40" value="" class="form-control input-sm"> 
     </div> 
     <div class="col-lg-3"> 
      <button type="button" class="btn-u btn-default margin-bottom-10" id="name" name="name">OWNER NAME</button> 
     </div> 
     <div class="col-lg-3"> 
      <button type="button" class="btn-u btn-default margin-bottom-10" id="location" name="location">PROPERTY ADDRESS</button> 
     </div> 
     <div class="col-lg-3"> 
      <button type="button" class="btn-u btn-default margin-bottom-10" id="billingAddress" name="billingAddress">BILLING ADDRESS</button> 
     </div> 
    </div> 

.required:after{ 
    content:"*"; 
    color:red; 
}

來源

2017-02-27 David Brierton

我也試圖把在課堂上輸入的需要。我正在做與被標記爲重複問題的內容相同的內容，所以只是尋找一些幫助讓它工作的幫助。 –

只是試試我的答案，花花公子 – webeno

...或複製 – webeno

在Twitter的引導網格系統不僅爲您的網頁的整個寬度工作一次，但也內個別col塊，即。一旦你定義了col-lg-3，那麼你就會在該塊內再增加12個col塊，將空間分成12個小部分。按照你喜歡的方式使用它，即分割8-4（如下面的例子 - 我建議在完整頁面視圖中打開片段），或者任何其他的，只要確保它總共是12。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 
    <div id="propertyidsearch"> 
 
     <div class="col-lg-3"> 
 
     \t <div class="col-lg-8"> 
 
      \t <input type="text" name="searchValue" maxlength="2000" size="40" value="" class="form-control input-sm"> 
 
      \t </div> 
 
     \t <div class="col-lg-4"> 
 
      \t <span style="color:red;">*</span> 
 
      \t </div> 
 
     </div> 
 
     <div class="col-lg-3"> 
 
      <button type="button" class="btn-u btn-default margin-bottom-10" id="name" name="name">OWNER NAME</button> 
 
     </div> 
 
     <div class="col-lg-3"> 
 
      <button type="button" class="btn-u btn-default margin-bottom-10" id="location" name="location">PROPERTY ADDRESS</button> 
 
     </div> 
 
     <div class="col-lg-3"> 
 
      <button type="button" class="btn-u btn-default margin-bottom-10" id="billingAddress" name="billingAddress">BILLING ADDRESS</button> 
 
     </div> 
 
    </div>

你可以用它在這裏玩：http://www.bootply.com/eV4qRJT14V

來源

2017-02-27 21:09:06 webeno

只是這樣一個巨大的差距:( –

閱讀我的編輯...你可以改變它爲10-2例如，在這裏玩它：http： //www.bootply.com/eV4qRJT14V – webeno

Bootstrap在輸入文本框旁邊放置星號

回答

相關問題