# Capitalize a tag in the UI
**URL:** https://meta.discourse.org/t/capitalize-a-tag-in-the-ui/57756
**Category:** Support
**Created:** [February 21, 2017, 11:59pm UTC](https://meta.discourse.org/t/capitalize-a-tag-in-the-ui/57756 "2017-02-21T23:59:23Z")
**Posts on this page:** 12
**Page:** 1
### Author:  [@jomaxro](https://meta.discourse.org/u/jomaxro)
#### Post date: [February 21, 2017, 11:59pm UTC](https://meta.discourse.org/t/capitalize-a-tag-in-the-ui/57756/1 "2017-02-21T23:59:23Z")
The company I currently work for capitalizes its name in a unique way (capital in the middle). On our Discourse site, we have a tag that we’d like to use the same capitalization. I understand Discourse lowercases all tags in the back-end, which is perfectly fine. I’m hoping to use JS or CSS to change the tag in the UI.
~~Is the following safe? Will it get all instances of a tag? Is there a better way to accomplish this?~~
```plaintext
.tag-tag_name_here {
visibility: hidden;
position: relative;
}
.tag-tag_name_here:after {
visibility: visible;
position: absolute;
content: "tag_nAme_here";
top: 0;
left: 0;
}
```
Edit: That doesn’t work…breaks on `/tags/tag_name_here`
---
### Author:  [@cpradio](https://meta.discourse.org/u/cpradio)
#### Post date: [February 22, 2017, 12:00am UTC](https://meta.discourse.org/t/capitalize-a-tag-in-the-ui/57756/2 "2017-02-22T00:00:54Z")
If it works, that should get all instances as you are hitting the tag name class directly which isn’t targetting a specific location.
---
### Author:  [@jomaxro](https://meta.discourse.org/u/jomaxro)
#### Post date: [February 22, 2017, 12:02am UTC](https://meta.discourse.org/t/capitalize-a-tag-in-the-ui/57756/3 "2017-02-22T00:02:31Z")
And it doesn’t work…
It works for tags in the topic list and in a single topic view, but it breaks on the specific `/tags` page…I’m back to searching for a solution.
---
### Author:  [@cpradio](https://meta.discourse.org/u/cpradio)
#### Post date: [February 22, 2017, 12:20am UTC](https://meta.discourse.org/t/capitalize-a-tag-in-the-ui/57756/4 "2017-02-22T00:20:47Z")
Can you screenshot where it doesn’t work?
```plaintext
.tag-bears {
visibility: hidden;
position: relative;
}
.tag-bears:after {
visibility: visible;
position: absolute;
top: 0;
left: 0;
content: "bEars";
}
```
The above works for me.
Tags page
Tags drop down on Latest
Topic List
Docked Topic Title
Undocked Topic Title
The list goes on, all places seem to show it with the capitalization.
---
### Author:  [@jomaxro](https://meta.discourse.org/u/jomaxro)
#### Post date: [February 22, 2017, 3:21pm UTC](https://meta.discourse.org/t/capitalize-a-tag-in-the-ui/57756/5 "2017-02-22T15:21:26Z")
Sorry for the delay, was travelling last night. Here are two examples where it’s not working. The first is the issue I mentioned yesterday. The second is another I noticed today.
`mysite.com/tags/tag_name`
A topic with multiple tags (that should be `bEars` between feedback and question):
---
### Author:  [@cpradio](https://meta.discourse.org/u/cpradio)
#### Post date: [February 22, 2017, 3:25pm UTC](https://meta.discourse.org/t/capitalize-a-tag-in-the-ui/57756/6 "2017-02-22T15:25:23Z")
To solve the first one, we need to exclude situations where it has the tag class name and the tag-drop class name, so the CSS becomes
```plaintext
.tag-bears:not(.tag-drop) {
visibility: hidden;
position: relative;
}
.tag-bears:not(.tag-drop):after {
visibility: visible;
position: absolute;
top: 0;
left: 0;
content: "bEars";
}
```
Looking at the second one still
---
### Author:  [@cpradio](https://meta.discourse.org/u/cpradio)
#### Post date: [February 22, 2017, 3:30pm UTC](https://meta.discourse.org/t/capitalize-a-tag-in-the-ui/57756/7 "2017-02-22T15:30:54Z")
To solve the second one, you need two more rules.
```plaintext
.list-tags, .discourse-tag.tag-bears:not(.tag-drop):after {
content: "bEars, " !important;
}
.list-tags, .discourse-tag.tag-bears:not(.tag-drop) {
margin-right: .5em;
}
```
One that says, hey, overwrite the existing `:after` rule for adding the comma in the tag separated list for my specific tag, and the second to provide some margin due to overriding it.
---
### Author:  [@jomaxro](https://meta.discourse.org/u/jomaxro)
#### Post date: [February 22, 2017, 3:39pm UTC](https://meta.discourse.org/t/capitalize-a-tag-in-the-ui/57756/8 "2017-02-22T15:39:24Z")
Thanks @cpradio, we’ve surpassed my CSS knowledge at this point. To confirm I want 4 CSS rules now?
Edit: Assuming I need all four, this still isn’t working…now there’s a comma added regardless of the tags place in the list:
---
### Author:  [@cpradio](https://meta.discourse.org/u/cpradio)
#### Post date: [February 22, 2017, 3:46pm UTC](https://meta.discourse.org/t/capitalize-a-tag-in-the-ui/57756/9 "2017-02-22T15:46:56Z")
> [@jomaxro](#):
>
> To confirm I want 4 CSS rules now?
Yes.
Try this to resolve the comma
```plaintext
.tag-bears:not(.tag-drop) {
visibility: hidden;
position: relative;
}
.tag-bears:not(.tag-drop):after {
visibility: visible;
position: absolute;
top: 0;
left: 0;
content: "bEars";
}
.discourse-tags .discourse-tag.tag-bears.simple:not(:last-child):after, .list-tags .discourse-tag.tag-bears.simple:not(:last-child):after {
content: "bEars, " !important;
}
.list-tags, .discourse-tag.tag-bears:not(.tag-drop) {
margin-right: .5em;
}
```
---
### Author:  [@jomaxro](https://meta.discourse.org/u/jomaxro)
#### Post date: [February 22, 2017, 3:50pm UTC](https://meta.discourse.org/t/capitalize-a-tag-in-the-ui/57756/10 "2017-02-22T15:50:21Z")
Awesome, thanks @cpradio! I’m learning more and more about CSS each time we chat, thank you so much!
---
### Author:  [@jomaxro](https://meta.discourse.org/u/jomaxro)
#### Post date: [February 22, 2017, 4:24pm UTC](https://meta.discourse.org/t/capitalize-a-tag-in-the-ui/57756/11 "2017-02-22T16:24:55Z")
Added two more rules to fix some lingering formatting issues - now the grey background exists for the tag filter, and the tag is properly aligned in the dropdown:
```plaintext
.tag-bears:not(.tag-drop) {
visibility: hidden;
position: relative;
}
.tag-bears:not(.tag-drop):after {
visibility: visible;
position: absolute;
top: 0;
left: 0;
content: "bEars";
}
.tag-badge-wrapper.badge-wrapper.bullet.tag-bears:after{
position: absolute;
padding: 5px;
}
.badge-category.tag-bears:after{
padding: 5px 8px;
background: #e9e9e9 !important
}
.discourse-tags .discourse-tag.tag-bears.simple:not(:last-child):after, .list-tags .discourse-tag.tag-bears.simple:not(:last-child):after {
content: "bEars, " !important;
}
.list-tags, .discourse-tag.tag-bears:not(.tag-drop) {
margin-right: .5em;
}
```
---
### Author:  [@JammyDodger](https://meta.discourse.org/u/JammyDodger)
#### Post date: [June 8, 2024, 12:44pm UTC](https://meta.discourse.org/t/capitalize-a-tag-in-the-ui/57756/12 "2024-06-08T12:44:56Z")
This topic was automatically closed after 2663 days. New replies are no longer allowed.