Solved

CSS style sheet issue with IE8

Posted on 2010-08-20
4
418 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
  • 2
4 Comments
 
LVL 83

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 83

Accepted Solution

by:
Dave Baldwin earned 500 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

Announcing the Most Valuable Experts of 2016

MVEs are more concerned with the satisfaction of those they help than with the considerable points they can earn. They are the types of people you feel privileged to call colleagues. Join us in honoring this amazing group of Experts.

Question has a verified solution.

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

So you have coded your own WordPress plugin and now you want to allow users to upload images to a folder in the plugin folder rather than the default media location? Follow along and this article will show you how to do just that!
The article shows the basic steps of integrating an HTML theme template into an ASP.NET MVC project
In this tutorial viewers will learn how to embed custom externally-hosted Google Fonts using the Google Font API in CSS Go to the Google Fonts website at google.com/fonts: Browse or search based on font properties or name to find a suitable font for…
The viewer will receive an overview of the basics of CSS showing inline styles. In the head tags set up your style tags: (CODE) Reference the nav tag and set your properties.: (CODE) Set the reference for the UL element and styles for it to ensu…

813 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

Need Help in Real-Time?

Connect with top rated Experts

15 Experts available now in Live!

Get 1:1 Help Now