CSS - Problem With Link Formatting

the website http://www.mostardesigns.com/4five1/ the top menu links work ok in firefox but in IE they wont display, here is my css code for the links:
Code:

	a.a_bannerLink:link, a.a_bannerLink:visited, a.a_bannerLink:active	{
		color:#FFFFFF;
		text-decoration:none;
		font-size:12px;
		font-weight:bold;
		padding:6px 15px 6px 15px;
		display:block;
		}
	a.a_bannerLink:hover	{
		color:#FFFFFF;
		text-decoration:none;
		font-size:12px;
		padding:6px 15px 6px 15px;
		background-image:url(../images/link_bg.jpg);
		background-repeat:repeat-x;
		display:block;
		}

any help is appreciated, thanks in advance.

Hi!

Having a problem again with firefox! On IE6 the links in the bottom news bar work fine, in firefox, only two of them work!

Its a little strange! Output at www.generating-sets.com

Validated the markup and the CSS and they validate fine! (apart from the buggy PHPSESSID issue and my use of marquee which is due to be removed shortly).

CSS below:


PHP Code:
 html {height:100%;}
body {
margin:0; padding:0; height:100%;
background-image:url(images/newback.jpg);
background-position:top right;
background-repeat:repeat-y;
background-color:#ffffff;
font-family: sans-serif; 
font-size: .7em;
}
#wrap {
background-image:url(images/newback150px.jpg);
background-position:top left;
background-repeat:repeat-y;
min-height:100%;
}
* html #wrap {height:100%}

div#navbar {padding: 0%; 
text-align: center;
background-image:url(images/newback.jpg);
background-repeat: repeat;
background-color: #000044; 
color: #ffffff; 
margin-bottom: 0px; 
border-bottom: solid #000000 1px}

div#formbox {
color: #000000;
padding: 2%;
border: #000044 solid 1px;
}
div.displaybox {
color: #000000;
padding: 2%;
margin: 1%;
border: #000044 solid 1px;
font-family: Times, "Times New Roman", serif; 
font-weight: bold; 
text-align: left;
font-size: 1.1em;
}
div#userbar {padding: 0%; 
text-align: center;
background-image:url(images/newback.jpg);
background-repeat: repeat;
background-color: #000044; 
color: #ffffff; 
margin-bottom: 0px; 
border-bottom: solid #000000 1px}

div#topleveladminbar {
padding: 0%; 
text-align: center;
background-image:url(images/newback.jpg);
background-repeat: repeat;
background-color: #000044; 
color: #ffffff; 
margin-bottom: 0px; 
border-bottom: solid #000000 1px
}

#header {
background-color: #000044;
background-image:url(images/wel.jpg);
width: 100%;
background-repeat: repeat;
border-bottom: 2px #000000 solid;
color: #ffffff; 
margin:0; padding:0;
height:100px;
}


#left {
float:left;
width:149px;
background-image:url(images/newback.jpg);
background-repeat: repeat;
color: #ffffff; 
text-align:center;
background-color: #000044;
border-right: 1px #000000 solid; 
}
#main {
position:relative;
margin-left:200px;
}

#content {
text-align:center;
padding:4px;
margin-right:200px;
margin-bottom:160px;
text-align:left;
}

#clearfooter {
clear:both;
height:80px;
overflow:hidden;
}
#footer {
height:40px;
background-color: #000044;
border-top: 2px #000000 solid;
margin:0; padding:0;
background-image:url(images/newback.jpg);
background-repeat: repeat;
margin-top:-0px;
color: #ffffff; 
text-align:center;
}
div#newsbar {padding: 0%; 
text-align: left;
height:150px; 
background-image:url(images/newback.jpg);
background-repeat: repeat;
background-color: #000044; 
color: #ffffff;
margin-left: +150px;
margin-right: +10px; 
margin-top: -180px;
border: 2px #000000 solid;  
width: auto;} 

code {
font-size:0.8em;
border:1px solid navy;
background-color:white;
color:#333333;
padding:10px;
display:block;
width:80%;
margin:10px auto;
overflow:auto;
}

h1 {font-size: 1.4em; 
font-family: Times, "Times New Roman", serif; 
font-weight: bold; 
text-align: left;} 

h2 {font-size: 1.3em; 
font-family: Times, "Times New Roman", serif; 
font-weight: bold; 
text-align: left;} 

h3 {font-size: 1.2em; 
font-family: Times, "Times New Roman", serif; 
font-weight: bold; 
text-align: left;} 

h4 {font-size: 1.1em; 
font-family: Times, "Times New Roman", serif; 
font-weight: bold; 
text-align: left;} 

h5 {font-size: 1em; 
font-family: Times, "Times New Roman", serif; 
font-weight: bold; 
text-align: left;} 

a:link {color: #ffffff; 
text-decoration: underline;} 

a:visited { 
    color: #ffffff; 
    text-decoration: underline;}     

a:hover {color: #ffffff;
background-color: #0000FF;
text-decoration: underline;} 

.displaybox a:link {color: #0000FF; 
text-decoration: underline;} 

.displaybox a:visited { 
    color: #0000FF; 
    text-decoration: underline;}     

.displaybox a:hover {color: #000044;
background-color: #EEEEEE;
text-decoration: underline;} 

Hi i am using to different styles to preview my links but i want when a link is being visited to return to his starting point.For example it is black and when is being visited i want it again when the second time the user come's to the page to see it black again.I tried a lot of methods but when i put the visited pseudo class it blocks and the the hover pseudo class is not working.Plz help

****the class that i have the problem is "boxes"

Code:

A:link {
COLOR: #2094E1; TEXT-DECORATION: none
}
A:active {
	COLOR: #2094E1; TEXT-DECORATION: none
	}
A:visited {
	COLOR: #2094E1; TEXT-DECORATION: none
	}
A:hover {
	COLOR: #ffffff; TEXT-DECORATION: none
	}

TD {
	FONT-SIZE: 10px; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif
		}
hr{
	color: #96A097;
	height: 0px;
	width: 150px;
}
#title{
	FONT-SIZE: 11px; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif
	COLOR: #000000;
}
.mainbox{
	FONT-SIZE: 10px; COLOR: #727C8E;
	padding-top:5px;
	padding-bottom:3px;
	}
.boxes {
	FONT-SIZE: 10px; COLOR: #000000;
	padding-top:3px;
   padding-left:3px;
	padding-right:3px;
	padding-bottom:3px;	
	 }
.boxes a:link {
	FONT-SIZE: 10px; COLOR: #000000;
}
.boxes a:active {
	FONT-SIZE: 10px; COLOR: #000000;
}
.boxes a:hover {
	FONT-SIZE: 10px; COLOR: #FFFFFF;
}
.boxes a:visited {
	FONT-SIZE: 10px; COLOR: #000000;

hey just got a small problem i dont know hw to fix, take a look at my site
http://funnyguys99.tripod.com/index.htm
if u hover over the links on the left side of the page, the border around them is not even. I want the border to end at the same spot when u hover over them, no matter how many more letters there are in the link.
Here's the Css for the left bar, please fix it

[CODE]
div#menubar
{
padding-right: 0.5em; padding-left: 0.5em;
padding-bottom: 20%;
margin: 120px 0px 0px 0px;
padding-top: 0.5em;
left: 0px;
width: 8em;
top: 0px;
height: auto;
position:absolute;
background:#FFFFFF;
border-right:1px solid black;
border-bottom:1px solid black;
border-top:1px solid black;
}
div#menubar ul
{
padding-left:0px;
padding-top:0px;
list-style:none;
line-height: 85%;
margin:0px;
}

div#menubar a
{
font-weight: bold;
text-decoration: none;
font-size:0.6em;
padding-right:7.5em;
padding-top:0px;
padding-bottom:0px;
}

div#menubar a:link
{
color: #ffa500;
}
div#menubar a:visited
{
color:dark red;

}
div#menubar a:active
{
font-weight: normal;
}
div#menubar a:hover
{
color: white;
background:#999999;
border:1px solid black;
}
[CODE]

I've set up two divs side by side using "float:left;".

In each of the Divs I have placed links, in the right hand div I can click the links but in the left hand div I can not. If I remove the "float:left;" I can then click the links in the left hand div but the divs are no longer aligned.

The problem only happens in FF not in IE.

I have copied the relative code below that is causing the problem.

Code:

#left{float:left;position:relative;width:49%;}
#right{position:relative;}
<div id="left"><a href="hh">hh</a></div>
<div id="right"><a href="hh">hh</a></div>

I don't want to have to change the layout just for FF so I'm hoping there is a fix for this problem.

Thanks

Hi guys,

I recently created a website for my Union, and am having some problems getting around a possible CSS error. Unfortunately the majority of our user base only has access to MS Internet Explorer 5, and it is within this browser that the CSS glitch is apparent:



The 'Join the union' image link tends to push right to the left margin, and I'm unsure how to correct this without adversely affecting either Firefox or more recent versions of IE/Opera/Safari.

Any help would be appreciated!

Edit: would be easier if I gave you the link! http://www.algus.org.uk/


Sajid

Hi there,

I have a drop down menu which I want to display next to another link to the right of the page (so there is a link to the far right and then the drop down to the left of the right link), however the drop down link is appearing under the far right link in FF, instead of beside it like it is in IE.

Any ideas what I have wrong?

This is my CSS:
PHP Code:
#tools{
text-align:right;
padding-right: 20px;
}

#add_business{
background-image: url('images/add_business.png');
height: 21px;
width: 156px;
float:right;
text-align:center;
padding-top: 4px;
}

#add_business a:link{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
color: #ffffff;
text-decoration:underline;
}

#add_business a:hover{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
color: #ffffff;
text-decoration:none;
}


#com_tools{
text-align: right;
margin-right: 200px;
margin-top: 0px;
float:right;
}


#menu ul .item{
display:none;
list-style:none;
list-style-image:none;
}

#menu ul:hover .item{
display:block;
list-style:none;
list-style-image:none;
}

#menu{position:absolute;
list-style:none;
list-style-image:none;
} 





and this is my HTML:
PHP Code:
<div id="tools">


<div id="com_tools">
<div id="menu">
<ul id="item1">
<li class="top">Community Tools</a> <img src="templates/images/arrow_down.gif" /></li>
<li class="item"><a href="#">menu item 1</a></li>
<li class="item"><a href="#">menu item 2</a></li>
<li class="item"><a href="#">menu item 3</a></li>
</ul>
</div> 
</div>

<div id="add_business"><a href="#">Add Your Business!</a></div>
</div> 

Hi, I need some help to design an image based menu. I have been trying it for a week now but still could not achieve and going little bit mad.

(Ive rewritten the same problem clearly this time hope someone can help me out)

My menu image consists of 4 sections and 3 layers which looks like this: img26.imageshack.us/img26/1268/menux.gif

1.home 2.archives 3.news 4.about - (layer 1 unvistided link)
1.home 2.archives 3.news 4.about - (layer 2 hover link: mouse over)
1.home 2.archives 3.news 4.about - (layer 3 active: shows what section the visitor on afer clicking and going to that page) and my problem is with the last layer.

I created the pages via admin panel of wordpress but give the links in the header.php manually myself without using codes.

so the links of each section are like this

home=http://localhost/wordpress/
archives=http://localhost/wordpress/?page_id=2
news=http://localhost/wordpress/?page_id=35
about=http://localhost/wordpress/?page_id=31

You can see my codes for CSS and PHP files below. Could you please have a look at my codes and provide the right code. The menu at the moment works ok except from the active side of it. I tried to give class id like "active" but failed to get it worked so please please change my wrong codes.

PHP code:

Code:

<ul id="nav">
   <li id="home"><a href="http://localhost/wordpress/">home</a></li>
   <li id="archives"><a href="http://localhost/wordpress/?page_id=2">archives</a></li>
   <li id="news"><a href="http://localhost/wordpress/?page_id=35">news</a></li>
   <li id="about" class="last"><a href="http://localhost/wordpress/?page_id=31">about</a></li>
		</ul>

CSS Code:

Code:

#nav {
     list-style: none;
     padding: 0;
     margin: -105px 25px;
     width: 332px;
     height: 30px;
     background: url('images/menu.gif');
     position: relative;
}

	ul#nav li { width: 80px;
	            height: 30px;
				padding: 0 4px 0 0;
				text-indent: -900px;
				float: left;
				}

	ul#nav li.last { padding: 0; }

		ul#nav li a, ul#nav li a:visited, ul#nav li a:hover { display: block; width: 80px; height: 30px; background: transparent url('images/menu.gif') no-repeat; outline: none; }

			ul#nav li#home a, ul#nav li#home a:visited { background-position: 0 0; }	

			ul#nav li#archives a, ul#nav li#archives a:visited { background-position: -84px 0; }

			ul#nav li#news a, ul#nav li#news a:visited { background-position: -168px 0; }

			ul#nav li#about a, ul#nav li#about a:visited { background-position: -252px 0; }

				ul#nav li#home a:hover { background-position: 0 -30px; }

				ul#nav li#archives a:hover { background-position: -84px -30px; }

				ul#nav li#news a:hover { background-position: -168px -30px; }

				ul#nav li#about a:hover { background-position: -252px -30px; }

			.home ul#nav li#home a, .home ul#nav li#home a:visited, .home ul#nav li#home a:hover { background-position: 0 -60px; cursor: default; }

			.archives ul#nav li#archives a, .archive ul#nav li#archives a:visited, .archives ul#nav li#archives a:hover { background-position: -84px -60px; cursor: default; }

			.news ul#nav li#news a, .news ul#nav li#news a:visited, .news ul#nav li#news a:hover { background-position: -168px -60px; cursor: default; }

			.about ul#nav li#about a, .about ul#nav li#about a:visited, .about ul#nav li#about a:hover { background-position: -252px -60px; cursor: default; }

The main problem i can understand from the earlier discussion
is that i need to give id class for active links in header.php code but i also need to rewrite the last four lines of css code according to the codes i wrote in php file. Can someone please help? Can someone please add or rewrite the active bit (in css codes - last 4 lines from the bottom) and in php file. please.

Hi All,

I built a website for a friend which is essentially working ok (thanks in large part to help I found on the net). She wanted to add a blog and I decided that this may be a good time to rework the site to a 960px width, partly to make it easier to make everything uniform. (A lot of blog templates are based on the 960)

I have been working on a new homepage based on the old homepage but with things moved around slightly due to the new size.

I also had a very long and convoluted CSS page before as it covered more than one page layout, so I decided to create a new simpler one just for this page.

Basically I took all the elements from the old CSS page that applied to the original homepage and put them in the new one, changing positioning coordinates where appropriate.

I've clearly done something wrong.

While the text links are in the correct places, they're not supposed to be visible (they should be hidden behind the various icons. Those icons should in turn have a rollover effect - If you check the original homepage you can see what I mean.)

The problem is something to do with the #nav1 and #nav2 attributes, but, because I'm a total newb, the original CSS was predominantly created by a couple of helpful souls I found online, but this means that I still don't really understand parts of it (though I am learning)

Please help.


This is my CSS:

Code:

* {
    padding:0;
    margin:0;
    list-style-type:none;
 }
.link1 a:link,.link1 a:visited,.link1 a:active { 
    color:#000000;
    font-family:arial,helvetica,sans-serif;
    font-weight:bold;
 }
.link1 a:hover { 
    background-color:#000000;
    text-decoration:none;
 }
.link2 a:link,.link2 a:visited,.link2 a:active { 
    color:#00def5;
    font-family:arial,helvetica,sans-serif;
    font-size:100%;
    font-weight:bold;
 }
.link2 a:hover { 
    color:#fff;
    background-color:#286d8c;
    text-decoration: none;
 }
body {
    background-color:#000;
    font-family:tahoma,arial,helvetica,sans-serif;
    font-size:100%;
    text-align: center;
 }
h1 {
    font:italic 16px tahoma,helvetica,arial,sans-serif;
    color:#fff;
    text-shadow: 0 1px 1px #000;
    text-align: center;
 }
#container1 {
    width:960px;
    height:1186px;
    margin:auto;
    background-image:url(../images/Homepage-Image960.jpg);
 }
#content1 {
    width:430px;
    height:50px;
    padding-top:460px;
    padding-bottom:20px;
    padding-right:5px;
    padding-left:5px;
    border:3px solid transparent;
    margin-top:0px;
    margin-bottom:155px;
    margin-right:0px;
    margin-left:66px;
    text-align:center;
    font-style:italic;
    overflow:auto;
 }
#nav1 {
    margin-bottom:25px;
    overflow:hidden;
 }
#nav1 li {
    margin-bottom:29px;
 }
#li1 {margin-left:697px;}
#li2 {margin-left:631px;}
#li3 {margin-left:565px;}
#li4 {margin-left:499px;}
#li5 {margin-left:433px;}
#li6 {margin-left:367px;}
#li7 {margin-left:36px;}
#li8 {margin-left:93px;}
#li9 {margin-left:93px;}
#li10 {margin-left:98px;}
#li11 {margin-left:320px;}
 }
#nav1 a,#nav2 a { 
    position:relative; 
    display:block;
    height:24px;  
    background-image:url(../images/Homepage-Image960-Invert.jpg);
 } 
#nav1 span,#nav2 span { 
    position:absolute;
    top:0;
    left:0;
    height:24px; 
    z-index:1;
    background-image:url(../images/Homepage-Image960-Invert.jpg);
    cursor:pointer;
 }
#about,#about span {
    width:239px;
    background-position:-697px -691px;
 }
#appts,#appts span {
    width:305px;
    background-position:-631px -740px;
 }
#fees,#fees span {
    width:371px;
    background-position:-565px -789px;
 }
#faq,#faq span {
    width:437px;
    background-position:-499px -838px;
 }
#links,#links span {
    width:513px;
    background-position:-433px -887px;
 }
#blog,#blog span {
    width:579px;
    background-position:-367px -936px;
 }
#about:hover span {
    width:239px;
    background-position:-697px -691px;
 }
#appts:hover span {
    width:305px;
    background-position:-631px -740px;
 }
#fees:hover span {
    width:371px;
    background-position:-565px -789px;
 }
#faq:hover span {
    width:437px;
    background-position:-499px -838px;
 }
#links:hover span {
    width:513px;
    background-position:-433px -887px;
 }
#blog:hover span {
    width:579px;
    background-position:-367px -936px;
 }
#nav2 li {
    float:left;
    display:inline;
 }
#nav2 a {
    height:96px;
 }
#nav2 span { 
    height:96px; 
 }
#bps,#bps span {
    width:131px;
    background-position:-26px -972px;
 }
#hps,#hps span {
    width:131px;
    background-position:-178px -972px;
 }
#scp,#scp span {
    width:131px;
    background-position:-330px -972px;
 }
#pay,#pay span {
    width:131px;
    background-position:-482px -972px;
 }
#email,#email span {
    width:131px;
    background-position:-851px -972px;
 }
#bps:hover span {
    width:131px;
    background-position:-26px -972px;
 }
#hps:hover span {
    width:131px;
    background-position:-178px -972px;
 }
#scp:hover span {
    width:131px;
    background-position:-330px -972px;
 }
#pay:hover span {
    width:131px;
    background-position:-482px -972px;
 }
#email:hover span {
    width:131px;
    background-position:-851px -972px;
 }

And this is the HTML it applies to:

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
   "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="language" content="english"> 
<meta http-equiv="Content-Style-Type" content="text/css">

<title>Helen Stow - Counselling Psychologist, Therapist, Life Coach.</title>
<meta name="google-site-verification" content="3hCMQLpWU3lVVahmEEWDtI_wRso4VELEwEnMbYvlTBk" >
<meta name="keywords" content="Lincoln, Psychologist, Counselling, Therapy, Therapist, Life Coach, Coaching, Paypal" >
<meta name="description" content="Homepage for Lincoln based, BPS Chartered Counselling Psychologist, Therapist and Life Coach Helen Stow." >
<meta name="abstract" content="Homepage for Lincoln based, BPS Chartered Counselling Psychologist, Therapist and Life Coach Helen Stow." >
<meta name="author" content="Helen Stow" >
<meta name="copyright" content="April 2011" >
<meta name="contact" content="helenstowcpsychol@btinternet.com" >
<meta name="googlebot" content="all, index, follow, none, noindex, nofollow, noarchive, nosnippet" >
<meta name="revisit" content="2 days" >
<meta name="subject" content="Homepage for Lincoln based, BPS Chartered Counselling Psychologist, Therapist and Life Coach Helen Stow." >
<meta name="title" content="<title>Homepage for Counselling Psychologist, Therapist and Life Coach Helen Stow</title>" >
<meta name="seoconsultantsdirectory" content="5" >

<link rel="stylesheet" type="text/css" href="style_homepage.css">

</head>
<body>

<div id="container1">
<div id="content1">
<p><h1>Helen Stow is a Lincoln
  based, Counselling Psychologist, Therapist and Life Coach.</h1></p>
</div>
<div class="link1">
<ul id="nav1">
 <li id="li1"><a id="about" href="http://helenstow-cpsychol.co.uk/about_helen.html" title="About">ABOUT<span></span></a></li>
 <li id="li2"><a id="appts" href="http://helenstow-cpsychol.co.uk/appts_fees.html" title="Appointments" >APPTS<span></span></a></li>
 <li id="li3"><a id="fees" href="http://helenstow-cpsychol.co.uk/fees.html" title="Fees">FEES<span></span></a></li>
 <li id="li4"><a id="faq" href="http://helenstow-cpsychol.co.uk/faqs.html" title="FAQs">FAQs<span></span></a></li>
 <li id="li5"><a id="links" href="http://helenstow-cpsychol.co.uk/links.html" title="Links">LINKS<span></span></a></li>
 <li id="li6"><a id="blog" href="http://helenstow-cpsychol.co.uk/blog/" title="Blog">BLOG<span></span></a></li>
</ul></div>

<div class="link1">
<ul id="nav2">
 <li id="li7"><a id="bps" href="http://www.bps.org.uk/" title="http://www.bps.org.uk/">BPS UK<span></span></a></li>
 <li id="li8"><a id="hps" href="http://www.hpc-uk.org/" title="http://www.hpc-uk.org/">HPC UK<span></span></a></li>
 <li id="li9"><a id="scp" href="http://www.societyforcoachingpsychology.net/" title="http://www.societyforcoachingpsychology.net/">SCP UK<span></span></a></li>
 <li id="li10"><a id="pay" href="http://helenstow-cpsychol.co.uk/paypal_payment.html" title="Paypal Payments">PAY<span></span></a></li>
 <li id="li11"><a id="email" href="mailto:helenstowcpsychol@btinternet.com" title="Email Me">EMAIL ME<span></span></a></li>
</ul></div>

</div><!-- end #container -->

</body>
</html>

I really would be incredibly grateful for all and any help.

My very best wishes,

Tom

I'm trying to set a link style for thumbnail images I have on my site but am having difficulty getting the style to take over the a { } and a:hover { } styles. Here is an example of the styles I have set;

Code:

a {
color: #005D93;
text-decoration: none;
}

a:hover {
color: #990000;
text-decoration: underline;
}

#thumb {
position: relative;    
float: left;
padding-left: 21px;
padding-bottom: 10px;
}

#thumb img {
width: 96px;
height: 145px;
}

#thumb img a {
text-decoration: none;
border: 2px;
border-color: #F5F6F7;
border-style: solid;
}

#thumb img a:hover {
border-color: #990000;
}

An example image tag is as follow;

Code:

<div id="thumb"><a href="details/page2.html" onclick="NewWindow(this.href,'name','640','460','yes');return false;"><img src="Images/2714.jpg"></a></div>

With the above mentioned, the thumbnail is surround by the a color of #005D93 and not the border color I expected. An example can be seen here - Example. I know it must be something fairly obvious I'm missing. Any help would be greatly appreciated.

Regards,
JT

redmeetsblue.com.au/forum-test/

I'm having a problem with our 3rd level sub-menu links in our top menu.

we need to specify a height:auto on the .moduletable_topmenu li a because I need each list item to have an easy changable name. this may mean it has 2 lines for 1 name such as the 3rd item under "Test".

Though when we have 2 or more 3rd level items the 2nd level moves with the 3rd level. Such as the 2nd item under "Test"

Can anyone think of a way to make this 2nd level list not move with the 3rd level items?

ok, so after i click a link it goes to the css visited link.

.menu_1a a:link {color:#666666; text-decoration: none;}
.menu_1a a:hover {Background: #666666; color:white;}
.menu_1a a:visited {color:#666666; text-decoratoin: none;}

is my code. after i have clicked a link and i hover over the link again the background color is #666666 and the color is #6666666. i need the visited link to have the same exact thing as the original link

any ideas?
-kevin

I have my "global" a:link color set to WHITE, but the WEATHER.COM module's background color that I want to use is also white, so the links are not visible.

How do I change the color of JUST the WEATHER.COM module, given the code that I'm using below?

Any help is HUGELY appreciated!



/*-- global settings --*/

a {
color: #FFFFFF;
text-decoration: none;}

a:hover {
text-decoration: none;
color: #FF5134;

/*-- module settings --*/

#ads {
float: right;
width: 160px;
padding: 0 0 0 20px;
.ads a {color: #1200FF;}
.ads a:hover {color: #1200FF;}
}

/*-- Weather --*/

#weather {
.weather a:link {color: #1200FF;}
.weather a:hover {color: #1200FF;}
}