- This topic has 5 replies, 2 voices, and was last updated 6 years, 5 months ago by
Tom.
-
AuthorPosts
-
November 15, 2019 at 2:54 pm #1064439
Ravi Dixit
I am using the following CSS for buttons on my site:
.button {
background-color: #2b60de;
font-size: 20px;
color: white;
border-radius: 4px;
border: none;
}As you can see the font colour is White in the above CSS but it is not working at all, I have tried changing colour from the in-built option by going to Appearance>Colors>Buttons but it didn’t work also.
Maybe, it is happening because I have set links colour using this CSS by your help.
.single .entry-content a,
.single .entry-content a:visited,
.single .entry-content a:hover,
.page .entry-content a,
.page .entry-content a:visited,
.page .entry-content a:hover {
border-bottom: 0px solid #2b60de;
color: #2b60de;
}
.entry-content .wp-show-posts a,
.entry-content .wp-show-posts a:visited,
.entry-content .wp-show-posts a:hover {
border-bottom: 0px;
color: black;
}
.abh_tab_content .abh_text a {
border-bottom: 0 !important;
}
.page-numbers {
border-bottom: 0 !important;
color: black;
}So, I am changing the colour of buttons’s text manually by the help of editor option, It is working good but not with the AMP Version.
As I have sent button’s text colour white, It is not showing in AMP version( see here https://prnt.sc/pxlqoj). I don’t know what to do know, please help me with this.
How can I set the colour on .button class and show buttons on AMP version too?
And another question, why list text’s font is different that body font in AMP version? Just because I am using custom CSS in it? See the above screenshot.
Note: I have changed the button text colour to black just because it should be shown in AMP. I don’t want my readers to confused.
Here is the link of the page: https://www.staymeonline.com/best-black-friday-web-hosting-deals/
November 15, 2019 at 11:41 pm #1064588Tom
Lead DeveloperLead DeveloperHi there,
Yea, I think it’s because of that CSS.
Try this instead:
.button, .single .entry-content a.button, .page .entry-content a.button { background-color: #2b60de; font-size: 20px; color: white; border-radius: 4px; border: none; } .single .entry-content a.button:visited, .single .entry-content a.button:hover, .page .entry-content a.button:visited, .page .entry-content a.button:hover { /* hover styles */ }How can I view the AMP version of the site?
November 16, 2019 at 7:10 am #1064892Ravi Dixit
Hello, Tom!
This CSS is not working.
November 16, 2019 at 9:20 am #1064982Tom
Lead DeveloperLead DeveloperNovember 17, 2019 at 12:00 am #1065285Ravi Dixit
It worked thanks
November 17, 2019 at 8:35 am #1065626Tom
Lead DeveloperLead DeveloperYou’re welcome 🙂
-
AuthorPosts
- You must be logged in to reply to this topic.