SkillShare Forum - CSS Beauty - multiple 'a:hover' styles Sat, 25 May 2013 06:31:12 -0400 http://cssbeauty.com/skillshare/ Lussumo Vanilla 1.1.9 multiple 'a:hover' styles http://cssbeauty.com/skillshare/discussion/443/?Focus=2952#Comment_2952 http://cssbeauty.com/skillshare/discussion/443/?Focus=2952#Comment_2952 Fri, 31 Mar 2006 10:42:31 -0500 spoo
I have another question. I'm noticing on some sites, they have two hover types for different links. For example, a navigation bar has one hover style, and content has another hover style, and footers have their own hover style.

Previously, I had been using a:hover for my styles, but would often require me using bad colors just to get the links to work in both header, body, and footer so the viewer could see the links. What would be the attribute(s) to create multiple hover formats?]]> multiple 'a:hover' styles http://cssbeauty.com/skillshare/discussion/443/?Focus=2953#Comment_2953 http://cssbeauty.com/skillshare/discussion/443/?Focus=2953#Comment_2953 Fri, 31 Mar 2006 10:46:10 -0500 nifkin
/* this styles all links by default */
a:link,a:visited,a:focus,a:hover,a:active { color:#f0c;}

/* this only styles links in a div with an id of navbar */
div#navbar a:link,div#navbar a:visited,div#navbar a:focus,div#navbar a:hover,div#navbar a:active { color:#cf0; }

/* only styles links in an LI element */
li a:link,li a:visited,li a:focus,li a:hover,li a:active { color:#c00; }]]> multiple 'a:hover' styles http://cssbeauty.com/skillshare/discussion/443/?Focus=2954#Comment_2954 http://cssbeauty.com/skillshare/discussion/443/?Focus=2954#Comment_2954 Fri, 31 Mar 2006 10:52:04 -0500 spoo multiple 'a:hover' styles http://cssbeauty.com/skillshare/discussion/443/?Focus=2955#Comment_2955 http://cssbeauty.com/skillshare/discussion/443/?Focus=2955#Comment_2955 Fri, 31 Mar 2006 10:55:31 -0500 adjustafresh
Nesting your CSS like Nifkin illustrated is important not only for hover styles, but for your code in general. If you're not nesting the styles in your CSS file you're asking for cascade trouble.]]> multiple 'a:hover' styles http://cssbeauty.com/skillshare/discussion/443/?Focus=2957#Comment_2957 http://cssbeauty.com/skillshare/discussion/443/?Focus=2957#Comment_2957 Fri, 31 Mar 2006 11:14:17 -0500 spoo http://spoo.tysonforgod.info/style.css

that's my stylesheet at the moment. Any suggestions how I can improve it?]]> multiple 'a:hover' styles http://cssbeauty.com/skillshare/discussion/443/?Focus=2961#Comment_2961 http://cssbeauty.com/skillshare/discussion/443/?Focus=2961#Comment_2961 Fri, 31 Mar 2006 16:23:04 -0500 benjitastic
Instead of:

border-bottom-width: thin;
border-bottom-style: solid;
border-bottom-color: #CCCCCC;

You could do:

border-bottom: 1px solid #CCC;
]]>