如何設置引導程序輸入字段的最小寬度

我有一個帶有標籤的簡單引導程序輸入字段。我現在的問題是，當我將瀏覽器調整爲較小的尺寸時，輸入欄變得太窄，以至於它不顯示值「1.00」。有沒有一種方法可以定義輸入字段的最小寬度？或者我在做這件事的方式有什麼問題嗎？非常感謝！如何設置引導程序輸入字段的最小寬度

<div class="container"> 

    <div class="input-group"> 

     <span class="text-center input-group-addon" id="sizing-addon2">Payment mount</span> 
     <input class="form-control" type="text" id="payment_amount" value="1.00"> 
    </div> 
</div>

來源

2017-02-14 user4046073

你可以在你的css中使用下面的代碼。

.container input { 
    min-width: 320px; /* depends how much minimum width you require */ 
}

如果它不起作用，請嘗試通過ID訪問它。

#payment_amount { 
    min-width: 320px; /* depends how much minimum width you require */ 
}

來源

2017-02-14 04:54:02

您正在使用引導程序，因此您應該使用引導程序網格系統。

見下example--

<html> 
 
    <head> 
 
    <meta charset="UTF-8"> 
 
     <title>Secure Login</title> 
 
      <meta name="viewport" content="width=device-width, initial-scale=1"> 
 
      <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> 
 
      
 
      <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"> 
 
     
 
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
 
      <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
 
    </head> 
 
    <body> 
 
     <div class="container"> 
 

 
    <div class="input-group"> 
 

 
     <span class="text-center input-group-addon" id="sizing-addon2">Payment mount</span> 
 
     <input class="form-control col-lg-8 col-md-10 col-sm-12 col-xs-12" type="text" id="payment_amount" value="1.00"> 
 
    </div> 
 
</div> 
 
</body> 
 
</html>

來源

2017-02-14 04:58:15 neophyte

如何設置引導程序輸入字段的最小寬度

回答

相關問題