Link styles with CSS

Question

I have a web page with 2 navigations - one horizontal under
the header and the other located vertically down the left of the
page.
The text colour styles of each are different.
So I wanted to allocate seperate a:link a:visit a:hover
a:active to both navigations, to do this I have used the following
css:
For the horizontal navigation:
.table2 a:link, a:visited {
text-decoration:none;
color:#FFFFFF;
.table2 a:hover, a:active {
color: #8da2c4;
For the second navigation:
.table3 a:link, a:visited {
text-decoration:none;
color: #717578;
.table3 a:hover{
color:#333333;
However when uploaded, instead of the horizontal navigation
returning to white once visited, it turns grey - the colour of the
second navigation. The browser (IE) obviously has trouble
seperating the assigned link styles even though I have tried
targeting more specifically.
Does anyone know of a way around this, if there is a way at
all??!
Much appreciated

Answer 1

Pseudo-classes and container styles are what you need - here
are some
tutorials.
http://www.mako4css.com
http://www.thepattysite.com/linkstyles1.cfm
http://www.projectseven.com/tutorials/pseudoclasses/index.htm
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.dreamweavermx-templates.com
- Template Triage!
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
http://www.macromedia.com/support/search/
- Macromedia (MM) Technotes
==================
"(_seb_)" <[email protected]> wrote in message
news:[email protected]...
> Lou28 wrote:
>> I have a web page with 2 navigations - one
horizontal under the header
>> and the other located vertically down the left of
the page.
>> The text colour styles of each are different.
>> So I wanted to allocate seperate a:link a:visit
a:hover a:active to both
>> navigations, to do this I have used the following
css:
>>
>> For the horizontal navigation:
>>
>> .table2 a:link, a:visited {
>> text-decoration:none;
>> color:#FFFFFF;
>> }
>> .table2 a:hover, a:active {
>> color: #8da2c4;
>> }
>>
>>
>> For the second navigation:
>>
>> .table3 a:link, a:visited {
>> text-decoration:none;
>> color: #717578;
>> }
>> .table3 a:hover{
>> color:#333333;
>>
>>
>> However when uploaded, instead of the horizontal
navigation returning to
>> white once visited, it turns grey - the colour of
the second navigation.
>> The browser (IE) obviously has trouble seperating
the assigned link
>> styles even though I have tried targeting more
specifically.
>>
>> Does anyone know of a way around this, if there is a
way at all??!
>>
>> Much appreciated
>>
>
> change:
> .table2 a:link, a:visited {
> to:
> .table2 a:visited, .table2 a:link {
>
> and do the same for .table3 links.
>
> --
> seb ( [email protected])
>
http://webtrans1.com | high-end web
design
> Downloads: Slide Show, Directory Browser, Mailing List