# Custom CSS different on dekstop and mobile
**URL:** https://meta.discourse.org/t/custom-css-different-on-dekstop-and-mobile/104984
**Category:** Support
**Created:** [24.Декабрь.2018 07:52:37 UTC](https://meta.discourse.org/t/custom-css-different-on-dekstop-and-mobile/104984 "2018-12-24T07:52:37Z")
**Posts on this page:** 8
**Page:** 1
### Author:  [@Beluk](https://meta.discourse.org/u/Beluk)
#### Post date: [24.Декабрь.2018 07:52:37 UTC](https://meta.discourse.org/t/custom-css-different-on-dekstop-and-mobile/104984/1 "2018-12-24T07:52:37Z")
I have tried to add custom colors for tags using this post:
[https://meta.discourse.org/t/add-a-custom-fontawesome-icon-and-color-to-your-tag/67881](https://meta.discourse.org/t/add-a-custom-fontawesome-icon-and-color-to-your-tag/67881)!
This worked delicious for the desktop version, but not for the mobile version.
(the css script is in the common one)
Is there something extra I need to care for?
---
### Author:  [@dax](https://meta.discourse.org/u/dax)
#### Post date: [24.Декабрь.2018 08:37:27 UTC](https://meta.discourse.org/t/custom-css-different-on-dekstop-and-mobile/104984/2 "2018-12-24T08:37:27Z")
First, the second screenshot seems the “desktop view” on mobile to me.
Second, I’m not sure what code are you using but yes, CSS classes on mobile may be different from desktop.
---
### Author:  [@Beluk](https://meta.discourse.org/u/Beluk)
#### Post date: [24.Декабрь.2018 09:18:11 UTC](https://meta.discourse.org/t/custom-css-different-on-dekstop-and-mobile/104984/3 "2018-12-24T09:18:11Z")
I used Google Chrome Developer tools to simulate mobile version. This reflect exactly the same what i seeing on my mobile device.
My code in **common css** is:
```plaintext
@mixin fAwesome2 ($fa, $col) {
&:link, &:visited, &.bullet::before {
background-color: #33333F;
color: $col;
}
&.bullet::before {
content: $fa;
}
}
[data-tag-name="bug"] { @include fAwesome2("\f135", #FF6448); }
[data-tag-name="feature"] { @include fAwesome2("\f135", #3CB371); }
[data-tag-name="quickwin"] { @include fAwesome2("\f135", #FFA500); }
[data-tag-name="declined"] { @include fAwesome2("\f135", #808080); }
[data-tag-name="question"] { @include fAwesome2("\f135", #1E90FF); }
[data-tag-name="urgent"] { @include fAwesome2("\f135", #EE82EF); }
```
How can i found out what i have to change to get to the same result on mobile and desktop version?
---
### Author:  [@dax](https://meta.discourse.org/u/dax)
#### Post date: [24.Декабрь.2018 09:46:27 UTC](https://meta.discourse.org/t/custom-css-different-on-dekstop-and-mobile/104984/4 "2018-12-24T09:46:27Z")
Ahhh, you are still using the old code before [Introducing Font Awesome 5 and SVG icons](https://meta.discourse.org/t/introducing-font-awesome-5-and-svg-icons/101643). This explains everything.
You should use this instead [https://meta.discourse.org/t/add-a-custom-fontawesome-icon-and-color-to-your-tag/67881/13](https://meta.discourse.org/t/add-a-custom-fontawesome-icon-and-color-to-your-tag/67881/13)
---
### Author:  [@Beluk](https://meta.discourse.org/u/Beluk)
#### Post date: [24.Декабрь.2018 10:15:02 UTC](https://meta.discourse.org/t/custom-css-different-on-dekstop-and-mobile/104984/5 "2018-12-24T10:15:02Z")
Well, i have read the post but for colors it looks to me there is no change, only for handling SVG Icons, right?
Meanwhile I have tried to analyze what is different on mobile and desktop and found out that on mobile version i have additionally the folowing code lines:
```plaintext
.topic-list .topic-item-stats .num .fa, .topic-list .topic-item-stats a, .topic-list .topic-item-stats a:visited {
color: #919191;
}
```
This is hiding my custom color. If i disable this line in the designer it activate the script below and after that is shows correct also on mobile.
How can it be removed or changed in an custom css?
---
### Author:  [@dax](https://meta.discourse.org/u/dax)
#### Post date: [24.Декабрь.2018 11:17:24 UTC](https://meta.discourse.org/t/custom-css-different-on-dekstop-and-mobile/104984/6 "2018-12-24T11:17:24Z")
> [@Beluk](#):
>
> Well, i have read the post but for colors it looks to me there is no change, only for handling SVG Icons, right?
Nope, even for colors. I think you have other customizations that interfere with the CSS of the tags.
Try only to add `!important` as in the code below:
```plaintext
@import "common/foundation/mixins";
[data-tag-name="tag1"]:link,
[data-tag-name="tag1"]:visited,
[data-tag-name="tag1"].bullet:before {
color: red !important;
}
```
---
### Author:  [@Beluk](https://meta.discourse.org/u/Beluk)
#### Post date: [24.Декабрь.2018 11:30:28 UTC](https://meta.discourse.org/t/custom-css-different-on-dekstop-and-mobile/104984/7 "2018-12-24T11:30:28Z")
I’m using v2.2.0.beta6 +84 without any other customizations. Adding **!important** fixed it! Thanks for your help and merry christmas.
---
### Author:  [@system](https://meta.discourse.org/u/system)
#### Post date: [23.Январь.2019 11:35:54 UTC](https://meta.discourse.org/t/custom-css-different-on-dekstop-and-mobile/104984/8 "2019-01-23T11:35:54Z")
This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.