Can a div have multiple classes (Twitter Bootstrap)

Question

Can a div tag have two classes?

I use twitter bootstrap, and there are two predefined classes that I would like to use.

One of them is the active class, which I would like to use in dropdown-toggle within the navigation bar.

What is the best way to approach this in html, without overriding css.

Answer 1

Of course, a div can have as many classes as you want (this applies to both bootstrap and HTML in general):

 <div class="active dropdown-toggle"></div> 

Just separate the classes by spaces.

Also: keep in mind that some bootstrap classes should be used for the same material, but in different cases (for example, alignment classes , you may want to align something left, right or center, but it should only be one of them), and you should not use them together, otherwise you will get an unexpected result, basically, what will happen is that the class with the highest specificity will be applied (or, if they have the same, then it will be the one that defined the latter in CSS). So keep in mind that you should avoid these things:

 <p class="text-center text-left">Some text</p> 

Answer 2

Absolutely, divs can have more than one class, and with some Bootstrap components you often need to have several classes in order for them to function the way you want. The use of several classes, of course, is possible outside the bootstrap. All you have to do is split each class into a space.

Example below:

 <label class="checkbox inline"> <input type="checkbox" id="inlineCheckbox1" value="option1"> 1 </label> 

Answer 3

Separate classes with a space.

 <button class="btn btn-success dropdown-toggle active" data-toggle="dropdown">Success <span class="caret"></span></button> 

demo: http://jsfiddle.net/wNfcg/

Answer 4

I'm not sure what you are asking specifically about bootstrap, i.e. can these two classes be used together or if you just ask at all?

You can apply as many classes to an element as you want, just separate the class names with a space

 <div class="active dropdown-toggle"></div> 

Answer 5

Yes, a div can take as many classes as you need. Use space to separate from each other.

  <div class="active dropdown-toggle custom-class">Example of multiple classses</div> 

Answer 6

You can add as many elements to an element, but you can add only one identifier per element.

 <div id="unique" class="class1 class2 class3 class4"></div> 

Answer 7

A div can contain more than one class using either bootstrap or not

<div class="active dropdown-toggle my-class">Multiple Classes</div>
To apply multiple classes, just separate the classes by spaces.

Take a look at these links, you will find many examples.
http://getbootstrap.com/css/
http://css-tricks.com/un-bloat-css-by-using-multiple-classes/

Answer 8

You can have several css class selectors:

For example,

 <div class="col-md-4 a-class-name"> </div> 

but only one id :

 <div id = "btn1 btn"> <!-- this is wrong --> </div> 

Answer 9

Space is used to create several classes:

 <div class = "One Two Three">

 </div>