[darcybaston]

Hi! I'm usually pretty good at implementing .css into my work, but I've run into something I just can't figure out.

I have a page with some blue background colors, and some white background colors. How do I set the page to use white colors for links on the blue backgrounds, and blue colors for links on the white?

I've tried to make a class like .whitelink or something, but that just changes the color for an 'unclicked' link, and the default page attributes take over the rest. I can't figure out how to make a:hover or a:link (In GoLive 5) tag attributes that are selective to what background color the links are found on.

MacNN does this somehow on their main index page (left special links are always white, and main news content are browser default) but I can't figure out how it's being done. What have I missed?

best wishes,
Darcy

[darcybaston]

Oh...just found some help with this at:
http://www.golivebible.com/tips/index.html

Darcy

[philzilla]

try something along these lines:
<BLOCKQUOTE><font size="1"face="Geneva, Verdana, Arial">code:</font><HR><pre><font size=1 face=courier>
A.bb {color: #eeeeee; font-size: <font color = blue>10</font>}
A:hover.bb {color: #cccccc}
A:focus.bb {color: #ffffff}
.nav2 {font-size: <font color = blue>12</font>}
A.nav2 {color: #<font color = blue>333399</font>; font-size: <font color = blue>10</font>}
A:hover.nav2 {color: #9999cc;}
A:focus.nav2 {color: #<font color = blue>999999</font>;}
</font>[/code]

[darcybaston]

Sorry philizilla, doesn't work. The web site I found deals with inline CSS, but I need a solution for external so that any new page I make (and the other 200 which already exist) can take advantage of two link color colutions. Thanks though!

Darcy

[philzilla]

awwww bum. oh well. i know it does work, when linked. mail me and i'll waffle on some more, if you can be bothered...? no worries if not

[darcybaston]

Oh I can be bothered, check your inbox. It's an important project of mine and it must be resolved.

Darcy

[derbs]

don't know whether you've sorted this, but i'll add my 2pence worth

when you create the css

eg
a.text:link { color......
a.text:hover {color.....

a.differenttext:link {color...
a.differenttext:hover {color...

you must use colons before the link or hover
you have to specify the style in the href tag

eg if you want the link to use the 'differenttext' colors:

&lt;a href="whatever.htm" class="differenttext"&gt;link here&lt;/a&gt;

like so

don't know if you knew this, hope it helps

[darcybaston]

Thanks derbs! Yup, we ironed all that out. GoLive seems to change my hand coded &lt;span&gt;&lt;/span&gt; inside of &lt;a&gt;&lt;/a&gt; to &lt;div class=""&gt;&lt;/div&gt; for me depending on if I use their properties palette or not, and it all works either way.

Thanks again to both of you for beign a wonderful resource.

Darcy

[derbs]

no problemo darcy, anytime

you should invest some time (and money) in dreamweaver. I'm an ex-goliver, but now you couldn't stop me using dreamweaver if you tried

[darcybaston]

When I was flipping the web dev software coin, I noticed the $99 upgrade cost for GoLive 5 from the free version of PageMill 3 that came with my iMac. I couldn't resist that, considering I'm also in Canada and $99 USD is much easier on the pocket book then a full Dreamweaver purchase.

Unless there's a crossgrade promotion you can mention? Also, what advantages have you found with Dreamweaver compared to GoLive? And is there an OS X version?

Darcy

[ervier]

You probably use tables for the different background-colors. If you don't want to have all your pages with &lt;a class="bluetable"&gt;, you could also give that specific table (or row, or cell) a class-name. So something like &lt;table class="bluetable"&gt;. The other table you don't have to define.

Then you do something like:

a:link { color="blue"; background-color="white"; }
etc

and

table.bluetable a:link { color="white"; background-color="blue"; }

This way you only have to use the class="blabla" thing one time. If you use any other style in the bluetable-class (like H1-H6, or bold etc), you can simply define this class like this:

table.bluetable h1 { etc }

Now you don't have to use &lt;h1 class="bluetable"&gt; anymore inside a &lt;table class="bluetable"&gt;. This way you keep the code cleaner, smaller and easier to edit.

[ 12-22-2001: Message edited by: ervier ]