Separate CSS for just one page

[Salvatos]

Hey there.
I use includes to get my header, sidebars, footer, etc. together. I'd like the links in the left sidebars to show differently than those in the regular text. I'm not that used to CSS, but I normally can edit some and make it work. Though now I've tried a lot of things and wasn't able to have the sidebar use a separate "a:link, a: active, a:visited" model. Either it keeps using the standard one or the whole website gets affected by the changes I try to make to this part only.

So...How do you insert a CSS into a single page without having it affect the rest of the pages? Can you do it at all with the links?

Here is the address if you want to see it: http://salvatos.x10hosting.com
I want the links in the text to be underlined but not those in the menu. And I want those in the menu to be black but not the others...

Thanks in advance

[curt15]

If they are under a CSS div tag, then you can use the div name and then a:link, a: active, a:visited

so

.example a:link, a: active, a:visited {
code
}

That should work.

[Salvatos]

Doesn't work either (but I know the problem comes from me :nuts: :happysad: )
I put this in my .css:

 .menu a:link, a: active, a:visited
{
 color: black;
 text-decoration: none;
}

And tried both <div id="menu"> and <div class="menu"> around my menu. But no difference. I don't know if that's what you meant with "CSS div tags" though. Where is...where are my mistakes?

P.S. Thanks for your help, points coming your way once it gets sorted out

[curt15]

.menu {
color : #000000;
}
.menu li a {
color :#000000;
text-decoration : none;
}
.menu li a:visited {
color : #000000;
text-decoration : none;
}
.menu li a:active {
color : #000000;
text-decoration : none;
}
.menu li a:hover {
color : #000000;
text-decoration : none;
}


Then use

<ul class="menu">
<li><a href="link">Your Link</a></li>
<li><a href="link">Your Link</a></li>
<li><a href="link">Your Link</a></li>
<li><a href="link">Your Link</a></li>
<li><a href="link">Your Link</a></li>
<li><a href="link">Your Link</a></li>
</ul>

To make the menu show up if you use something else, post it here and I can change it

For the rest of the stylesheet

A:link {
color :RED;
text-decoration : underline;
}
A:visited {
color : RED;
text-decoration : underline;
}
A:active {
color : RED;
text-decoration : underline;
}
A:hover {
color : RED;
text-decoration : underline;
}

If you just change RED to whatever colour you want to use, and stick that at the top of the stylesheet.

Hope this works

[Salvatos]

The problem is that I dropped the idea of the listed menu, I just use a table. Here's a simplified example:

<table>
<tr>
<td bgcolor="#DBD4B5">
<a href="url.php">link</a>
</td>
</tr>
<tr>
<td bgcolor="#DBD4B5">
<a href="url.php">link</a>
</td>
</tr>
</table>

I'll try what you posted without the "li" part and switch the <ul> for a <div>. I'll be right back to say if it worked.

[curt15]

OK then

<table class="menu">
<tr>
<td class="menutd">
<a href="url.php">link</a>
</td>
</tr>
<tr>
<td class="menutd">
<a href="url.php">link</a>
</td>
</tr>
</table>

.menu {
color : #000000;
}
.menu a {
color :#000000;
text-decoration : none;
}
.menu a:visited {
color : #000000;
text-decoration : none;
}
.menu a:active {
color : #000000;
text-decoration : none;
}
.menu a:hover {
color : #000000;
text-decoration : none;
}

.menutd {
background:#DBD4B5;
}

Hopes this helps

[Salvatos]

Hah! There you go! It works, now I just need to tweek it to have it look exactly how I want.

I know it's probably some basic stuff, but all the coding I do I learned it by myself so I often miss technical details. So I must thank you a lot, and here are 20 credits and some reputation as a small reward

[curt15]

Glad I could help.