OneMoreQuestion OneMoreQuestion - 3 months ago 10
CSS Question

Bootstrap grid framwork does not work with form-control

I am using

Bootstrap
s grid system to make my
input
box smaller. However, it seems to conflict with
form-control
.

HTML:

<form class="col-md-8">
<div class="form-group">
<input type="text" name="input_box" class="form-control col-md-3"/>
</div>
</form>


In Chrome's developer tools, the
25%
(for
.col-md-3
is automatically crossed out). If I take out
.form-control
then it works but looks ugly.

How do I use them both? Note that I do not want to change the width in .formcontrol because I have other forms that also use this and will get messed up

enter image description here

Answer

How about this

<form>
   <div class="col-md-8">
        <div class="form-group col-md-3">
            <input type="text" name="input_box" class="form-control"/>
        </div>
    </div>
</form>
Comments