Community Forums › Forums › Archived Forums › General Discussion › Change hyperlinks colors, but the code doesn't change it
- This topic has 5 replies, 2 voices, and was last updated 9 years, 12 months ago by nutsandbolts.
-
AuthorPosts
-
April 1, 2014 at 9:51 am #97920clairebullMember
I'm trying to change the color of my hyperlinks (they are pink at
the moment) but the color won't change. It's as if something else is
overriding the code.This is the code I try to change:
a,
a:visited {
color: #009b07;
text-decoration: none;
}Also, which code do I use to change the color of <H1> headings and Menu Text Links: The menu links on second menu bar just under the header graphic (they are pink at the moment).
I emailed support and she said I had to change the code here instead - but how?
I want to change Hyperlinks, <h1> and menu text links?
-------------------------------------------
The h1, menu links and text links are included in this section:
.lifestyle-pink a,
.lifestyle-pink a:visited,
.lifestyle-pink #nav,
.lifestyle-pink #nav li li a:hover,
.lifestyle-pink #nav li li a:active,
.lifestyle-pink #subnav li li a:hover,
.lifestyle-pink #subnav li li a:active,
.lifestyle-pink h1,
.lifestyle-pink h2,
.lifestyle-pink h2 a,
.lifestyle-pink h2 a:visited,
.lifestyle-pink #cat,
.lifestyle-pink .widget_archive select,
.lifestyle-pink .s,
.lifestyle-pink .enews #subbox {
color: #a74272;
}Many thanks,
Claire
http://www.momblogginghelp.comApril 1, 2014 at 8:48 pm #98007nutsandboltsMemberYou just need to change the next to last line with
color: #a74272;
to the hex code of the color you want.
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+April 2, 2014 at 5:48 am #98046clairebullMemberThank you so much, I was looking for three different codes!
One last thing if you don't mind. I'm changing the code below to make the <h2> heading smaller than <h1> but when I change it, the H1 and H2 stay the same size.
How can I make the H2 at 24px (as it is now) and the H1 to be 28px?
}
h1,
h2,
h2 a,
h2 a:visited {
color: #cc307e;
font-family: 'Oswald', arial, serif;
font-size: 24px; <==================== CHANGE THIS
line-height: 30px;
}Many thanks,
April 2, 2014 at 8:58 am #98083nutsandboltsMemberFind this section of your stylesheet:
/* Headlines ------------------------------------------------------------ */ h1, h2, h3, h4, h5, h6 { color: #cc307e; font-family: 'Oswald', arial, serif; font-size: 28px; margin: 0 0 10px; } h1, h2, h2 a, h2 a:visited { color: #cc307e; font-family: 'Oswald', arial, serif; /* font-size: 28px; */ line-height: 30px; }
If you remove the font size lines from each of those rules (commenting out doesn't always work, so I'd remove them completely), you can create a separate rule for each heading underneath that part like this:
h1 { font-size: 28px; } h2 { font-size: 24px; } h3 { font-size: 20px; }
etc. I'm really surprised to see that all the headings are set to the same size right now - that's very strange!
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+April 2, 2014 at 9:14 am #98087clairebullMemberThanks Andrea,
I've done that.
I also find it strange that I could only use one bit of code to change hyperlinks/headings/menu text links. What if I wanted them all a different color to each other (which I don't).
Oh well, I'm happy with what I've got now!
Thanks
April 2, 2014 at 9:15 am #98088nutsandboltsMemberIf you wanted different colors for different elements, you could remove each item from the longer CSS rule and create individual rules for them, just like I did above with the headings tags.
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+ -
AuthorPosts
- The topic ‘Change hyperlinks colors, but the code doesn't change it’ is closed to new replies.