Still celebrating National IT Professionals Day with 3 months of free Premium Membership. Use Code ITDAY17

x
?
Solved

CSS style sheet issue with IE8

Posted on 2010-08-20
4
Medium Priority
?
422 Views
Last Modified: 2012-05-10
Can someone explain to me why the a: link section does not work in IE8 but does work in Firefox

  <style type="text/css">
a:link {
text-decoration:none;
font-size: 17px;
font-weight: bold;
font-family:sans-serif;
COLOR: #7E6C40;
}
a:visited {
COLOR: #7E6C40;
}
a:hover {
COLOR: #7E6C40;
}
a:active {
COLOR: #7E6C40;
}
  </style>

This isn't an actual style sheet, but part of my page source code - I don't know if that matters or not....
0
Comment
Question by:bwask
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
4 Comments
 
LVL 84

Expert Comment

by:Dave Baldwin
ID: 33488300
It seems to work fine.  What is it not doing for you?  You may have other code interacting with it.
0
 
LVL 13

Expert Comment

by:myderrick
ID: 33491605
Hi, It works for me too. See my codes.

Please note the following as well (although you may already know):

Note: a:hover MUST come after a:link and a:visited in the CSS definition in order to be effective!!

Note: a:active MUST come after a:hover in the CSS definition in order to be effective!!

Note: Pseudo-class names are not case-sensitive.

Good luck

MD
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>


<style type="text/css">
a:link {
text-decoration:none;
font-size: 17px;
font-weight: bold;
font-family:sans-serif;
COLOR: #7E6C40;
}
a:visited {
COLOR: #7E6C40;
}
a:hover {
COLOR: #7E6C40;
}
a:active {
COLOR: #7E6C40;
}
  </style>
  
  
</head>

<body>

<a href="#">Hello</a>
</body>
</html>

Open in new window

0
 

Author Comment

by:bwask
ID: 33501984
It's the first section that isn't working -
My links are blue, the font size is wrong,...
All of the visited, hover and active do what they're supposed to.
It's this that has me stumped -
a:link {
text-decoration:none;
font-size: 17px;
font-weight: bold;
font-family:sans-serif;

I can take all of this out and not have it make a difference.

What I want to have is what you see in the second html - "eric-test"

And then finally a screen shot of what it looks like - links wrong color, font type wrong, font size wrong.



Working.html
eric-test.html
Screenshot.jpg
0
 
LVL 84

Accepted Solution

by:
Dave Baldwin earned 2000 total points
ID: 33502912
You need to put all that in a generic 'a' style for it to affect the rest.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>


<style type="text/css">
a {
text-decoration:none;
font-size: 17px;
font-weight: bold;
font-family:sans-serif;
COLOR: #7E6C40;
}
a:link {
COLOR: #7E6C40;
}
a:visited {
COLOR: #7E6C40;
}
a:hover {
COLOR: #7E6C40;
}
a:active {
COLOR: #7E6C40;
}
  </style>
  
  
</head>

<body>

<a href="#">Hello</a>
</body>
</html>

Open in new window

0

Featured Post

New benefit for Premium Members - Upgrade now!

Ready to get started with anonymous questions today? It's easy! Learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Use these top 10 tips to master the art of email signature design. Create an email signature design that will easily wow recipients, promote your brand and highlight your professionalism.
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
In this tutorial viewers will learn how to style different bullet points for unordered lists in CSS. Begin with a normal unordered list; the default bullet point is a solid circle: In the CSS, create a defined class of unordered list by typing "ul.S…
In this tutorial viewers will learn how to embed an audio file in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: : The declaration should display (CODE) HTML5 is supported by the most recent versions of all major browsers…

688 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question