I need to apply CSS to a specific class and id of an element like this.
<div class="contents" id="contents">
I tried
#contents .contents { ... }
but it doesn't seem to work.
How to apply the css for a specific class and id ?
With
#contents.contents {...}
It works OK.
#contents.contents { ... }
… should work fine. The problem is likely somewhere in code that you haven't shared with us.
#contents .contents { ... }
… means "An element that is a member of class contents that is a descendent of an element with the id contents"
In your example, if you're looking for only that ID, you can just use:
#contents { ... }
The class is unnecessary because the ID is unique and will only find that element.
However, if you want to apply it to that ID AND anything with that class, you want:
#contents, .contents { ... }
#content, .contents { ... } says: Apply these styles to anything with an ID of content OR anything with a class of content. If you want to AND it, it would be #contents.contents { ... }.id="contents" on your page.