CSS Forum

**hootch** · 04-08-2010, 09:24 AM

Hi all,

I'm in need of some assistance. For a university project I need to develop a website, but I've hit a roadblock. For the past two hours here's what I've been trying to do.

I've made a collapsible list with JavaScript which utilizes <a href> in HTML to collapse the different lists. Because the page needs to be XHTML valid I have to markup these links by assigning them class="example" parameters instead of using <h2></h2> tags.

The list is enclosed in a content div, which styles a lot of my other pages of the website, as well as my normal links like navigation.

In my CSS I have:

Code:

#content a:link {
	font-size: 13px;
	color: #6D929E;
	font-weight: bold;
	text-decoration: none;
	}

#content a:visited {
	font-size: 13px;
	color: #9FAEB3;
	font-weight: bold;
	text-decoration: none;
	}

#content a:hover {
	font-size: 13px;
	color: #9FAEB3;
	font-weight: bold;
	text-decoration: none;
	}

#content a:active {
	font-size: 13px;
	color: #6D929E;
	font-weight: bold;
	text-decoration: none;
	}

For the last two hours I've tried to add code ranging from

Code:

a.example
{
	
	font-size: 31px;
	color: #6D929E;
}

to

Code:

.example
{
	
	font-size: 31px;
	color: #6D929E;
}

to

Code:

#content a.example:link
{
	
	font-size: 31px;
	color: #6D929E;
}
#content a.example:visited
{
	
	font-size: 31px;
	color: #6D929E;
}
#content a.example:active
{
	
	font-size: 31px;
	color: #6D929E;
}
#content a.example:hover
{
	
	font-size: 31px;
	color: #6D929E;
}

And many more in between. I've read loads of websites that didn't lead me to anywhere. Now I'm turning to you, the great internet to help me out...

I have uploaded the relevant files here, http://drop.io/o5anxa0

If anyone could help me out, I'd be forever grateful!

**TripleMoons** · 04-08-2010, 11:49 PM

A link to the functioning site would be helpful.

Your section specific CSS should be something like...

div#content a, div#content a:hover {
}

or

.example a, .example a:hover {
}

**GeekSpecialties** · 04-09-2010, 04:59 PM

You just need to be more specific in your CSS.

Code:

div#content ul.treemenu li a:link, 
div#content ul.treemenu li a:visited
{
    
    font-size: 13px;
    color: #d16d10;
}

This is one of my favorite examples.
http://www.stuffandnonsense.co.uk/ar...city_wars.html