...

View Full Version : Simple but frustrating: Link not getting styled



Fullminster Buc
06-09-2010, 03:28 PM
I am not getting my links styled and I don`t understand why. Here is an example of code not giving any result in my browsers, even after deleting cache. Any ideas?



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<?xml version="1.0" encoding="utf-8"?>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Untitled Document</title>
<style>
body{
a:link {text-decoration: none; color: red;};
a:hover {text-decoration: underline; color: white;}
}
</style>
</head>
<body>
<p><a href="http://www.test.com">test</a></p>
</body>
</html>

SB65
06-09-2010, 03:39 PM
You don't need to wrap all your css in the body tags. Try:



<style type="text/css" media="screen">
a:link {text-decoration: none; color: red;};
a:hover {text-decoration: underline; color: white;}
</style>

rakasv
06-09-2010, 05:35 PM
or


<style>
body p{
a:link {text-decoration: none; color: red;};
a:hover {text-decoration: underline; color: white;}
}
</style>


or



<style>
p{
a:link {text-decoration: none; color: red;};
a:hover {text-decoration: underline; color: white;}
}
</style>

Scriptet
06-09-2010, 08:33 PM
@rakasav you mean:


body p a:link{text-decoration: none; color: red;}
body p a:hover {text-decoration: underline; color: white;}

or



p a:link{text-decoration: none; color: red;}
p a:hover {text-decoration: underline; color: white;}

Pseudo-Classes like :link and :hover should come after the selector before the block not inside the block { }!!

rakasv
06-09-2010, 08:44 PM
both =) sorry i was a little distracted

Apostropartheid
06-09-2010, 09:18 PM
I am not getting my links styled and I don`t understand why. Here is an example of code not giving any result in my browsers, even after deleting cache. Any ideas?

Off topic, but I'm loving the name.

Fullminster Buc
06-09-2010, 11:15 PM
Thanks guys, case closed.
A:link {text-decoration: none; color: grey;}
A:visited {text-decoration: none; color: grey;}
A:active {text-decoration: none; color: grey;}
A:hover {text-decoration: underline; color: black;}

body{
font-size:90%;
margin: 0;
padding: 0;
border: 0;
overflow: hidden;
height: 100%;
max-height: 100%;
} etc.

Fullminster Buc
06-09-2010, 11:15 PM
Offtopic: glad you like it Astro, you`ve been creative yourself.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum