CSS classes for tags

Support
1

Hi,

Is there CSS classes for tags in the HTML?
I’d like to add CSS style to topics with a specific tag.

Thanks

2 Likes
2

You can absolutely apply CSS to a single tag. I recently did the same looking to capitalize a letter in a tag.

In short, you can handle most cases with the following (replace tag_name_here with the tag you wish to style):

.tag-tag_name_here {
    // Declarations go here
}

Depending on the exact style you want, you may need more rules to handle all cases. You can see the final set of rules we came up with for my issue here.

3 Likes
3

Yeah, I was wondering if that would be helpful too, but I think this person wants to decorate other topic elements based on the existence of a tag, and that will be a tad more difficult, if not impossible to do in CSS alone.

There are a couple of things that could be done in Core to make this easier, such as, applying the tag classes to the topic entity itself on the topic listing and the actual topic.

Beyond that, I believe JavaScript would have to be used to read the tag class inside an entity and then apply a new class to its parent. But thoes are my thoughts on it as of right now.

3 Likes
4

Totally misread that, thanks @cpradio. I do agree that if you are correct about the intent, it will be significantly more difficult.

5

Yes, some type of CSS “parent selector” would be nice. eg.

td.the_val < tr { 
 font-weight: bold; 
} 
<tr> 
<td></td> 
<td class="the_val"></td>

But alas there is no such thing and AFAIK the technical difficulty involved means there never will be.

However, JavaScript parentNode() is capable of going up the DOM

I would not want “every element to have every possible class value” like some apps do (cough WordPress) but I think if adding a class value to an ancestor element so that CSS could “drill down” would help there is a good chance it might just happen à la pr welcome

2 Likes
7

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.