Community Forums › Forums › Archived Forums › Design Tips and Tricks › Need Style link colour and hover differently in footer
Tagged: css, hover color, link color, Simple Hooks, style sheet
- This topic has 7 replies, 2 voices, and was last updated 10 years ago by Davinder Singh Kainth.
-
AuthorPosts
-
April 2, 2014 at 3:18 am #98031newedgemarketingMember
I need to create a separate CSS style for the link colour and hover style in my footer.
My link colour and footer colour throughout my website are the same colour so any links on in my footer aren't visible. Currently you can't see my phone number or email address even though they're both there.
I believe to try and create some custom css that control those elements separately to the rest of the site.
I have tried to use genesis simple hooks plugin to create some separate styles to those elements and add the custom css to my style sheet but i obviously have no idea what i'm doing!
Anyone any ideas?
http://119.81.1.69/~newedgem/April 2, 2014 at 3:38 am #98032Davinder Singh KainthMemberIn footer widgets section in style.css file - add following code
.footer-widgets a { color:#fff !important; }
Sunshine PRO genesis theme
Need Genesis help? Davinder @ iGuiding Media | My Blog | Fresh Genesis ThemesApril 3, 2014 at 2:10 am #98245newedgemarketingMemberThanks Davinder
I've added that but its changed all of the other footer font colours to black.
I want the main font colour in the footer to be white and the link colour to be white as well with just the hover as it is as an underline.
April 4, 2014 at 12:09 am #98402Davinder Singh KainthMemberAs of now all font color is black and link color is white in the footer widgets area. Which color modification you wish to achieve from here on ?
Sunshine PRO genesis theme
Need Genesis help? Davinder @ iGuiding Media | My Blog | Fresh Genesis ThemesApril 4, 2014 at 1:33 am #98409newedgemarketingMemberHi Davinder
I just want all of the font colour in the footer to be white including the link colour and then have a hover on the links which is just an underline text decoration.
Is that possible. your code changed the link colour white which is what i wanted but then changed all the other colours form white to black.
April 4, 2014 at 2:41 am #98413Davinder Singh KainthMemberChange the following code:
.footer-widgets a { color:#fff !important; }
into
.footer-widgets, .footer-widgets a { color:#fff !important; }
Sunshine PRO genesis theme
Need Genesis help? Davinder @ iGuiding Media | My Blog | Fresh Genesis ThemesApril 4, 2014 at 4:45 am #98420newedgemarketingMemberYou've done it again thanks Davinder! 😉
Think i need some lessons in css because i clearly have no idea how that did that!
April 4, 2014 at 6:02 am #98424Davinder Singh KainthMemberCool, here is little explanation about CSS code in question
.footer-widgets -> targets all content in 3 footer widgets
.footer-widgets a -> targets all hyperlinked content in 3 footer widgets.Since we wanted white color for both types, I clubbed these together. As such you could also use them separately, result will be same:
.footer-widgets { color:#fff !important; } .footer-widgets a{ color:#fff !important; }
Sunshine PRO genesis theme
Need Genesis help? Davinder @ iGuiding Media | My Blog | Fresh Genesis Themes -
AuthorPosts
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.