Color & Styling of link

[Christina]

For the life of me I can’t figure out how to change the styling of the links on the mobile version of the site.

This is my code

<a class="switchmobile" href="site.com/?am_force_theme_layout=mobile">Switch To Mobile Version</a>

The following is a bit overboard but I was trying everything I could think of

a.switchmobile:link, a.switchmobile:visited, a.switchmobile:active, a.switchmobile:hover {
font-size: 36px !important;
color: #ff0000 !important;
text-decoration: none;
}`

The above works on the desktop theme but when I change layout=mobile to layout=desktop, then view the mobile version, the css doesn’t work.

I’ve also tried using a.am-switch-btn in the CSS.

In short:
CSS works when viewing desktop version
CSS does not work when viewing mobile version
Codes are 99% identical

[Christina]

Blah ….. didn’t close the code box. Can’t find an edit button so I’ll try that again.

Switch To Mobile Version - See more at: https://dineshkarki.com.np/forums/topic/color-styling-of-link#sthash.thZeUCtQ.dpuf

a.switchmobile:link, a.switchmobile:visited, a.switchmobile:active, a.switchmobile:hover {
font-size: 36px !important;
color: #ff0000 !important;
text-decoration: none;
} - See more at: https://dineshkarki.com.np/forums/topic/color-styling-of-link#sthash.thZeUCtQ.dpuf

[Christina]

*laughs* I give. Hopefully someone can translate that and help.

Again,
CSS works when viewing desktop version
CSS does not work when viewing mobile version
Codes are 99% identical

[Dinesh]

Can you send me your site url ?

[Christina]

Can I send it via email or pm? Don’t want the url out for public viewing.

[Dinesh]

Hi Christina,

Thanks for your url.

I have found that you are using the wrong css selector based on your element structure as below.

Switch To Desktop Version

The css selector should be like this.
.switchmobile a:link, .switchmobile a:visited, .switchmobile a:active, .switchmobile a:hover { YOUR CSS STYLING GOES HERE}

Hope this help.

Thanks

[Christina]

Dangit. I swear I tried that. *laughs* .class a:link is how I normally write all of my code so I wonder what I’d written before that made it not work.

At any rate, it’s fixed now. Thanks a bunch!

[Dinesh]

🙂

[Author]

Posts