Apply bootstrap form styling to div elements without changing class - html

Question

I'm building a screen with many form elements using the convention below; it saves me from adding class='...' to every input, button, and select box.
.formDiv button {
font-family: verdana;
font-size: 10px;
border: 1px solid #999;
border-radius:3px;
}
.formDiv input {
font-family: verdana;
border: 1px solid #999;
width: 110px;
}
Now I want to use bootstrap; I've got everything configured; confirmed it's working.
Is it possible to apply bootstrap3 styling without adding class='some-bs-style' to each form element? Ideally, I want to do something like this:
.myDiv input {
//use bs3 input styling
}
.myDiv select {
//use bs3 select styling
}
I see bootstrap uses form-control, so I tried setting that on the parent div using:
<div id='#formdiv' class='form-control'>
..but it did not work; I suck at css, so no surprise there.

Answer 1

Copy the rules from form-control and just apply the rules to input and select if you want to use it automatically for your formdiv class:
.formdiv input, select {
RULES FROM FORM CONTROL
}
DEMO HERE
Updated DEMO + CSS is here: http://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.css
Copying is necessary because you cannot inherit rules from other classes. Therefore if you want to avoid applying form-control style to each input and select, you have to use approach above. But this is still faster than putting "form-control" to each input in each form.