Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to apply two CSS classes to a single element

Tags:

html

css

Can I apply 2 classes to a single div or span or any HTML element? For example:

<a class="c1" class="c2">aa</a> 

I tried and in my case c2 does not get applied. How can I apply both classes at once?

like image 962
dojoX Avatar asked Mar 30 '11 06:03

dojoX


People also ask

Can an element have two CSS classes?

An element is usually only assigned one class. The corresponding CSS for that particular class defines the appearance properties for that class. However, we can also assign multiple classes to the same element in CSS.

Can you use two classes one element?

HTML elements can be assigned multiple classes by listing the classes in the class attribute, with a blank space to separate them.

Can you add 2 classes to a div?

Multiple ClassesHTML elements can belong to more than one class. To define multiple classes, separate the class names with a space, e.g. <div class="city main">. The element will be styled according to all the classes specified.

How do you select an element with multiple classes?

Use the getElementsByClassName method to get elements by multiple class names, e.g. document. getElementsByClassName('box green') . The method returns an array-like object containing all the elements that have all of the given class names.


1 Answers

1) Use multiple classes inside the class attribute, separated by whitespace (ref):

<a class="c1 c2">aa</a> 

2) To target elements that contain all of the specified classes, use this CSS selector (no space) (ref):

.c1.c2 { } 
like image 185
Salman A Avatar answered Oct 13 '22 23:10

Salman A