17 replies [Last post]
jpetrou
Offline
Regular
Last seen: 14 years 2 weeks ago
Joined: 2005-10-21
Posts: 11
Points: 0

can someone please help me with CSS link attributes- im using DW8. Iam building a site and i cannot seem to get the text link to colour properly. I have the link set to the correct colour, and the hover working correctly, but when the link is visited, even without any attributes set to the css for visited, it still shows up in the famous purple visited link colour.

there is a site you can check out, this is exactly how i want my css to work(except for the colours) www.creativeclue.com.au the text link on the splash page "welcome to creativeclue website".

If anyone can help, it would be most appreciated.

cheers!

Tyssen
Tyssen's picture
Offline
Moderator
Brisbane
Last seen: 6 years 1 week ago
Brisbane
Timezone: GMT+10
Joined: 2004-05-01
Posts: 8201
Points: 1386

dreamweaver 8 help with very basic CSS problem

You have to specify your link first, then visited, then hover.

How to get help
Post a link. If you can't post a link, jsFiddle it.
My blog | My older articles | CSS Reference

Day
Day's picture
Offline
Enthusiast
Texas
Last seen: 15 years 2 weeks ago
Texas
Timezone: GMT-6
Joined: 2005-10-07
Posts: 103
Points: 0

dreamweaver 8 help with very basic CSS problem

A memory device I learned on some brilliant tutorial or other recently.

LoVe HaTe:

Link
Visited
Hover
Target

That's the order you have to declare them in. Cheers, and, my advice? Don't bother with Dreamweaver. It lies to you. Honestly.

->Day<-

Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 5 years 41 weeks ago
London
Joined: 2004-06-06
Posts: 15668
Points: 2806

dreamweaver 8 help with very basic CSS problem

Target :? = Active!

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

briski
briski's picture
Offline
Elder
London
Last seen: 8 years 19 weeks ago
London
Timezone: GMT+1
Joined: 2004-02-16
Posts: 1066
Points: 0

dreamweaver 8 help with very basic CSS problem

I always prefered

Lord
Vader's
Handle
Formely
Anakin

for

Link
Visited
Hover
Focus
Active

Mainly because it includes the oft forgoten focus state and it's more geeky Laughing out loud

Chris..S
Chris..S's picture
Offline
Moderator
Last seen: 8 years 4 weeks ago
Timezone: GMT+1
Joined: 2005-02-22
Posts: 6078
Points: 173

dreamweaver 8 help with very basic CSS problem

In addition to the above.

Browsers provide a default styling to most elements. If you don't provide your own style to override the browser's styling you get that styling.

You can think of the default style as

a:link {color: blue; text-decoration: underline;}
a:visited {color: purple; text-decoration: underline;}

Firefox picks up those styles from its Options/General/Fonts & Colours settings.

Your style rules must have a greater specificity to override the default styles.

a {color: somecolour} should do the trick.
a:link {color: somecolour} will not affect a:visited. :link and :visited are mutually exclusive. :link is a "not yet visited" link.

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 4 hours 40 min ago
Dallas
Timezone: GMT-5
Joined: 2004-06-25
Posts: 9772
Points: 3854

dreamweaver 8 help with very basic CSS problem

Except that focus should come before hover, thus
link
visited
focus
hover
active.

That's if you want to respond to hover on a link that already has focus.

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

briski
briski's picture
Offline
Elder
London
Last seen: 8 years 19 weeks ago
London
Timezone: GMT+1
Joined: 2004-02-16
Posts: 1066
Points: 0

dreamweaver 8 help with very basic CSS problem

This is true.

However doing that ruins my meory aid Wink and more importantily why would you give a different style to hover and focus?

They both have equal weight in my mind and should have the same style.

It's just as possible that I could be hovering over something then want to focus to it, I know an unlikely event but just as meaning full and hovering over a focused link.

I don't think it matter which way around you have these two in all honesty.

Chris..S
Chris..S's picture
Offline
Moderator
Last seen: 8 years 4 weeks ago
Timezone: GMT+1
Joined: 2005-02-22
Posts: 6078
Points: 173

dreamweaver 8 help with very basic CSS problem

You probably want a slight difference between focus and hover. Hover is more current - its where the focus is about to move to...

Lord Vader's former handle, Anakin.

Wink

briski
briski's picture
Offline
Elder
London
Last seen: 8 years 19 weeks ago
London
Timezone: GMT+1
Joined: 2004-02-16
Posts: 1066
Points: 0

dreamweaver 8 help with very basic CSS problem

Lord Vader aside, I dissagree that "Hover is more current - its where the focus is about to move to." Focus and Hover can be independant and each can lead to the other though some user action. I tab to field x giving it focus then hover over it or I can hover over it then click it to give it focus. Anyway it really does not matter than much I suspect.

One question though, why would "You probably want a slight difference between focus and hover"?

Chris..S
Chris..S's picture
Offline
Moderator
Last seen: 8 years 4 weeks ago
Timezone: GMT+1
Joined: 2005-02-22
Posts: 6078
Points: 173

dreamweaver 8 help with very basic CSS problem

To tell them apart.

briski
briski's picture
Offline
Elder
London
Last seen: 8 years 19 weeks ago
London
Timezone: GMT+1
Joined: 2004-02-16
Posts: 1066
Points: 0

dreamweaver 8 help with very basic CSS problem

Err thanks for that Laughing out loud

Ok Why would you want to tell them appart, they peform the same function - "heres a link, if you enter of click now it's going to be fired"

Chris..S
Chris..S's picture
Offline
Moderator
Last seen: 8 years 4 weeks ago
Timezone: GMT+1
Joined: 2005-02-22
Posts: 6078
Points: 173

dreamweaver 8 help with very basic CSS problem

To know whether its enter or click. Smile

For links I typically don't bother to differentiate, for input elements I do.

briski
briski's picture
Offline
Elder
London
Last seen: 8 years 19 weeks ago
London
Timezone: GMT+1
Joined: 2004-02-16
Posts: 1066
Points: 0

dreamweaver 8 help with very basic CSS problem

Wink

Yes actualy I can see it would be a good thing for inputs.

Day
Day's picture
Offline
Enthusiast
Texas
Last seen: 15 years 2 weeks ago
Texas
Timezone: GMT-6
Joined: 2005-10-07
Posts: 103
Points: 0

dreamweaver 8 help with very basic CSS problem

Hugo wrote:
Target :? = Active!

Doh! :oops:

->Day<-

jpetrou
Offline
Regular
Last seen: 14 years 2 weeks ago
Joined: 2005-10-21
Posts: 11
Points: 0

thanks for the tip guys but im still a little lost

does this mean i have to set a visited and active css attributes even when i dont need visited?

this is what i do: in dreamweaver,

once i link the text to the correct page, i highlight the text link right click go to CSS styles and add new then i choose a:link, i fill in all the attributes and click ok.

i right click on the text link and do the same step above, but then i skip a:visited, cause i dont want it.

then i do all the attributes for the a:hover and then i skip a:active.

and it is still not working for me....

It seems you guys are very knowlegable on this topic, please help.

thanks

Day
Day's picture
Offline
Enthusiast
Texas
Last seen: 15 years 2 weeks ago
Texas
Timezone: GMT-6
Joined: 2005-10-07
Posts: 103
Points: 0

dreamweaver 8 help with very basic CSS problem

My guess, and this is just a guess, is that your problem is Dreamweaver. I've never used the thing, so I can't be sure, but nearly everyone here will tell you not to waste your time with it.

Hand crafting your CSS and HTML gives you more control and more reliable results. DW's WYSIWYG thingie lies to you, anyway. If you put in the time to learn how to write your own CSS and HTML now, it will save you much time (and headaches) later. It won't eleminate them, but you'll be better equiped to figure out why things are going wrong if you know how things work in the first place.

->Day<-

Chris..S
Chris..S's picture
Offline
Moderator
Last seen: 8 years 4 weeks ago
Timezone: GMT+1
Joined: 2005-02-22
Posts: 6078
Points: 173

dreamweaver 8 help with very basic CSS problem

edit your stylesheet and remove all the :link so the selector's just have whatever came before the ":". That will give your link a style for all occasions - which will be overridden by the a:hover style rule when you hover over it.

e.g.

a {color: green; text-decoration: none;}
a:hover {color: red; text-decoration: underline;}