I have an issue with removing the class
JavaScript
x
5
1
<div>
2
<div class="categoryname current-category">Category block</div>
3
<div class="categoryname">Category block</div>
4
</div>
5
I am trying to display only block with class “categoryname current-category”
I try this CSS code:
JavaScript
1
7
1
.categoryname{
2
display:none;
3
}
4
.categoryname:first-child{
5
display:block;
6
}
7
But that CSS code every time display first category, I am looking to only display block with “current-category” class, Some pages have a situation that class “current-category” is on other block:
JavaScript
1
5
1
<div>
2
<div class="categoryname">Category block</div>
3
<div class="categoryname current-category">Category block</div>
4
</div>
5
Advertisement
Answer
When styling an element that contains more than one class you need to write the classnames without spaces
JavaScript
1
6
1
.categoryname{
2
display: none;
3
}
4
.categoryname.current-category{
5
display: block;
6
}
JavaScript
1
4
1
<div>
2
<div class="categoryname current-category">Category block</div>
3
<div class="categoryname">Category block</div>
4
</div>