I don’t have to tell you that I am new in web development …I am sure you will understated this from my question.
I was trying everything yesterday to change the link color (all links) in my website.
The problem is that in dreamweaver the links appear to be fine but in the IE7
all links was red. I did change the a:link attributes hundreds of times I also add a link2
In my css file but nothing. All changes I made was observable in dreamweaver but not in IE7 (specially the color).
So finally I discover another way, using the span style="color tag which works fine.
……any explanation why I could not do it with css, is this the proper way to color links?????
Thanks in advance

Recommended Answers

All 5 Replies

You said that you had a seperate CSS class for your links, right? You're on the right track then:)

Changing the default color in all browsers via CSS should be:

a:link(color:#000000}
a:active{color:#000000}
a:visited{color: #000000}
a:hover{color:#0000000}

I'm sure you know already to change the hexidecimal values to change the colors of each state.

To have two different combonations of link colors, default being one of them, you should have:

a.link2:link(color:#000000}
a.link2:active{color:#000000}
a.link2:visited{color: #000000}
a.link2:hover{color:#0000000}

Sometimes toolbars in IE have been known to overwrite css styles like that. You might want to try checking to see if you have any like google toolbar.

thanks a lot for your reply.
I have done that you said changing colours form the css file but this dint work.
Also the fact that in dreamewever, i could change the colours but not in the IE means that the answer is more complex

A few things to keep in mind

How are you linking to your CSS styles? Have you tried inline styles yet? Conditional statements? or have you checked your syntax?


There are two ways to attach an external CSS file to your html file.:

<link href="css/main.css" rel="stylesheet" type="text/css" media="all" />

and:

<style type="text/css">
@import url (yourfile.css);
</style>

There shouldn't be a performance difference using either one of these--unless you're looking at your page through a really old browser like netscape 4, in that case @import is ideal.-- but what I'm saying is that those are the correct HTML syntax. Make sure all of your links and imports link to right directory and that the above code is in your <head></head> tags, because that is paramount to have it being parsed correctly.

If you want to overwrite anything in your external CSS file or something that IE might be adding, you can try an inline style.

For example, in your head tags after the css files you're importing or linking to add:

<style type="text/css">
a.link2:link(color:#000000}
a.link2:active{color:#000000}
a.link2:visited{color: #000000}
a.link2:hover{color:#0000000}
</style>

Like i said, that should overwrite anything proceeding it.

Or try checking your syntax of your CSS. It's not required to have a semicolon after your last style, or before the closing curly braces.

this is valid:

a.link2{
color:#000000;
text-decoration:none;
}

and this is too:

a.link2{
color:#000000;
text-decoration:none
}

however, this is not:

a.link2{
color:#000000
text-decoration:none;
}

Usually a missing semicolon can affect all of the CSS styling following it thus making a major impact on how your webpage is rendering.

Lastly, try conditional statements to override anything IE:

<!--[if IE]>
<style type="text/css">
your css code here.

</style>
<![endif]-->

It's good practice to put it in your HEAD tags, but you can insert it above the tags you're trying to style.


Hope that does the trick for you. If not , I'm wandering if you're using the WYSISWYG method of editing? Do you write your code from scratch(or copy and paste), or do you use the point and click method? I prefer writing my code in Dreamweaver, but in code view instead of design view. From experience, it seems to give me greater control since I know more about web standards and how the browsers execute the code than Dreamweaver does.

DON'T!

There are several reasons not to do this:

1. For accessibility, many browsers allow the owner of the browser to turn off changes to link colors and define overriding colors.

2. If a browser is set to override, and you use a background color that matches the standard text color, the link disappears because it matches the background.

3. Link colors are pseudo-classes, and affect all links the same way. They will all be changed to the color of the last change encountered.

Maybe you're right MidiMagic, but those suggestions have worked for me in the past and it's hard to tell what the problem is, so my suggestions might be completely useless. OP, if you're reading this , can you please provide a link to what you're working on, so we can take a look at it. We would be glad to help you.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.