2016-12-29 9 views
0

パディングはしても表示されません。どのようにして選択領域にパディングを追加できますか?パディングの選択方法ブートストラップ

select.custom{ 
 
    padding: 30px!important; 
 
    -moz-appearance: none; 
 
    -webkit-appearance:none; 
 
} 
 
select.custom option{ 
 
    padding: 30px!important; 
 
    -moz-appearance: none; 
 
    -webkit-appearance:none; 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 
<div class="col-md-12"> 
 
<select class="form-control custom"> 
 
<option>AAAAAAAAAAAAAA</option> 
 
</select> 
 
</div>

enter image description here

答えて

1

あなたは助けをカスタマイズするために選択

.btn { 
 
    padding: 20px!important; 
 
} 
 
.dropdown-menu>li>a { 
 
    padding: 20px!important; 
 
}
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css"> 
 
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.7.5/css/bootstrap-select.min.css"> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.7.5/js/bootstrap-select.min.js"></script> 
 

 

 
<div class="col-md-12"> 
 
    <form> 
 
    <div class="form-group"> 
 
     <label for="sel1">Select list (select one):</label> 
 
     <select class="selectpicker" data-style="btn-primary" multiple data-max-options="2"> 
 
     <option>AAAAAAAAAAAAAA</option> 
 
     </select> 
 
    </div> 
 
</form> 
 
    </div>

+0

Thansをブートストラップselectpickerを使用することができます。 –

関連する問題