CODEWITHSUNDEEP
htmltwitter-bootstrap-3
blackpanther
blackpanther

Reputation: 11486

Ability to use Bootstrap 3 grid system to specify width of select element

I have the following <select> element as follows:

<select id="statusSelect" style="width:175px" class="form-control" name="statusCode">

However, someone has just told me that this can cause dynamic exceptions on hidden elements. My question is this: How can I use Bootstrap 3's Grid system to specify the width of the <select> element. I have tried the following:

<select id="statusSelect" class="form-control col-md-2" name="statusCode">

But, unfortunately, using col-md-2 or even col-md-4 does not change the width of the <select> element. So, can anyone help me to see how I can use Bootstrap 3's grid classes to specify the width of the <select> drop-down box.

Any help would be much appreciated.

Upvotes: 2

Views: 755

Answers (2)

Reda
Reda

Reputation: 711

col-md-2 does not change the width because form-control overwrite the width property because it has width: 100%

you can add class col-md-2 without form-control 

<select id="statusSelect" class="form-control col-md-2" name="statusCode">

or add the col-md-2 to the parent like @trieber answer

Upvotes: 1

timo.rieber
timo.rieber

Reputation: 3867

You have to add the classes to an wrapping div.

<div class="col-md-2">
  <select id="statusSelect" class="form-control" name="statusCode">
</div>

Upvotes: 2

Related Questions