0
210
Viewsbootstrap select multiple box height
I have following dropdowns, one is simple select dropdown and other one is select multiple dropdown:
I am using following code for it:
<div class="row mt-4">
<div class="col-lg-4" id='trainingTimeDiv'>
<div class="form-group">
<label class="form-label">Training Time</label>
<select class="form-select" name="trainingTime" id="trainingTime">
<option id="30" value="30">30 seconds</option>
<option id="60" value="60">60 seconds</option>
<option id="90" value="90">90 seconds</option>
<option id="120" value="120">120 seconds</option>
<option id="150" value="150">150 seconds</option>
<option id="180" value="180">180 seconds</option>
<option id="210" value="210">210 seconds</option>
<option id="240" value="240">240 seconds</option>
<option id="270" value="270">270 seconds</option>
<option id="300" value="300">300 seconds</option>
</select>
</div>
</div>
<div class="col-lg-4" id='independentVariables'>
<div class="form-group">
<label class="form-label">Independent Variables</label><br>
<select name='variableDropDownList' id="variableDropDownList" class="selectpicker col-lg-12"
multiple="multiple" data-live-search="true">
<option>Opt 1</option>
<option>Opt 2</option>
<option>Opt 3</option>
<option>Opt 4</option>
</select>
</div>
</div>
</div>
I want to make height of Independent Variables dropdown similar to that of Training Time dropdown. How can I make it possible please?
·
Juan Pablo Isaza
1 answers
Answer question0
What you could possibly do, is use this adjusting for your preferred height:
select{
height: 30px;
}
If this is not usable, please post any additional CSS you are using since select adjusts to the size of its contents, therefore, making it difficult to discern the solution here.
·
Juan Pablo Isaza
Report
Answer question