CODEWITHSUNDEEP
css
Dominique
Dominique

Reputation: 309

Target one class of those specified with CSS

I have a div element which has 3 classes:

<div class='captcha_article captcha_email captcha_register'></div>

How can I target the third class for example, without affecting the style of the other two classes in the div?

Also, if I were to have 4 classes, how to target the last one without using last-child property ? Would :nth-child apply here?

Upvotes: 1

Views: 55

Answers (1)

David Jones
David Jones

Reputation: 4305

You misunderstand CSS.

You can add styles to the captcha_register class by doing this in your CSS file.

.captcha_register {
    // Attributes go here
}

Depending on where this is placed in your CSS file will determine if any of the style attributes adding to the captcha_article and captcha_email classes will be affected.

For example:

.captcha_article {
    height: 200px;
}

.captcha_register {
    height: 100px; // This will override the height of 200px on the div
}

UPDATE

If each class is suppose to represent a different web page then adding them all to the same element might explain why you are seeing unexpected results. It might be better to combine the styles that appear in all classes into one reusable class, lets call it .page. Then on each page you use this you can modify it with another class, if it needs to be modified.

Upvotes: 6

Related Questions