How to make all links highlight red?

Hello, it's me again...lol.

Can someone please advise me as to how to make it so that when I put my mouse over ALL links in my forum, that they appear red and underlined in red? Right now, the only links that do this are the ones on my index page and for the forum's individual names.

I want it to be like this forum, where when you hover your mouse over any link, it's red. Also, I'm using PHPBB3 and one of the skins designed by Jalokim so I am unable to change the hover link colour in my admin panel. I know I need a code to do this and Sunny_D...you gave me this code to use before but it only worked on my forum's individual Titles.

Code:


a:link{color:#110BFF}
a:visited{color:#110BFF}
a:hover{color:#110BFF}


Thank you again.

To the best of my knowledge you change the color of Hover Link Color. Under Display>Color.

Hello Dot Com,

Yes, thank you for answering. I can't do it that way though because I'm using a skin on PHPBB3 and not all of the elements can be changed in the admin panel unfortunately. It has to be a code that is inputted into my CSS and I just need the code.

Thanks though.

Did you put all four CSS codes in? A "hover" element will not work unless all link elements are specified. You also need:
a:active{color:#}

Saurus wrote:Did you put all four CSS codes in? A "hover" element will not work unless all link elements are specified. You also need:
a:active{color:#}

Hi Saurus,

No, the element you mentioned wasn't in my CSS so I did add it but it didn't change anything.

Brad38 wrote:

Saurus wrote:Did you put all four CSS codes in? A "hover" element will not work unless all link elements are specified. You also need:
a:active{color:#}

Hi Saurus,

No, the element you mentioned wasn't in my CSS so I did add it but it didn't change anything.

That's strange.

You said you were using a custom template? can you access the css page for that template? If it already contains those elements you can't overwrite them - they have to be substituted. That is so in any CSS design - not just these forums. If it's an external stylesheet you should be able to edit it with the parameters you want.

[quote="Saurus"]

Brad38 wrote:

That's strange.

You said you were using a custom template? can you access the css page for that template? If it already contains those elements you can't overwrite them - they have to be substituted. That is so in any CSS design - not just these forums. If it's an external stylesheet you should be able to edit it with the parameters you want.

Hello, ..newbie here, newbie alert! Ummm. It's the Vista Blue skin by Jalokim. Yes, I can access the CSS and change elements in there in my admin control panel. Does this mean I have to substitute the elements and if so, how would I find them and where exactly are they? I see all the codes in there but finding the ones to correspond with all the links seems hard.

thank you.

Sorry I haven't answered yet, must have overlooked it.

Well, use the code below and paste it at the very bottom (important!) of your custom CSS text. Best would be to define all link colors again as they have to be listed in this specific order:

Code:

a:link{color:#aabbcc;text-decoration:none;}
a:visited{color:#aabbcc;text-decoration:none;}
a:hover{color:#aabbcc;text-decoration:underline;}
a:active{color:#aabbcc;text-decoration:none;}

a:link defines the normal link colors, a:visited those you have already clicked. a:hover are links where you hover your mouse over. a:active appears when you are currently clicking the link. Change the color codes as you wish for all of them - if you don't know them, go to the Colors tab in your admin panel, find a color in the color-picker and copy the hex-code in the box nearby.

If something is unclear, please let me know.

[quote="Brad38"]

Saurus wrote:

Brad38 wrote:

That's strange.

You said you were using a custom template? can you access the css page for that template? If it already contains those elements you can't overwrite them - they have to be substituted. That is so in any CSS design - not just these forums. If it's an external stylesheet you should be able to edit it with the parameters you want.

Hello, ..newbie here, newbie alert! Ummm. It's the Vista Blue skin by Jalokim. Yes, I can access the CSS and change elements in there in my admin control panel. Does this mean I have to substitute the elements and if so, how would I find them and where exactly are they? I see all the codes in there but finding the ones to correspond with all the links seems hard.

thank you.

You can't possibly be more new than me - this is my first week:)
OTOH, I do have 2 websites I designed and run totally on CSS stylesheets - verified - so I have some experience with it.

I'm not familiar with individual skins for the forums. It depends a lot on whether they use an external stylesheet called by the main page or if the stylesheet is included in the main page. If you see a line at the top saying something like <link rel: stylesheet...> it is external and you probably can't get to it. If you have a section on the main html page starting and ending with <style></style>, the css is internal and able to be edited. So just look for that section on the main html page and edit the included elements to what you want.

Where exactly are the link elements? I always put them at the very top of my styles code. Others may put them somewhere else. Really doesn't matter much - I try to arrange my code to make it simple to find and edit on all my pages. You will recognize those tags when you see them. If the style sheet does appear from your admin panel it should be a simple matter to change the colors and add the a.active element if it isn't there. Be sure to close the style tag with }

Here's an example of the link elements from one of my sites. Note you can add additional elements, such as a background color to the hover to make it stand out even more.

Code:


a:link {color:#00FFFF}
a:visited {color:#FF9900}
a:hover {font-weight:normal;background-color:#FF9900;color:#FFFFFF }
a:active {color:#0000FF}


You can probably figure that my links will show the hover as an orange background with white text. You can change font weight, font style, etc by adding to the css, but remember to put the ; between each and close it with the }

Hi Sunny_D & Saurus,

Thank you both for answering my question. Sunny_D, I did what you advised, I took out the original codes you gave me and replaced the entire code with this, saved and using the colour code number I wanted:

table.table1 thead th{color:#fff;font-weight:bold;}

Code:

a:link{color:#110BFF;text-decoration:none;}
a:visited{color:#110BFF;text-decoration:none;}
a:hover{color:#110BFF;text-decoration:underline;}
a:active{color:#110BFF;text-decoration:none;}

I also placed these colour codes at the very bottom of my CSS stylesheet and underneath the code you gave me to make my Tables be highlighted and in bold, white colour....that is the "table.table1 thead th{color:#fff;font-weight:bold:} code just above.

The really strange part to me is that, even though I deleted and replaced the earlier code you gave me (see above) post, I still have a red highlight on only my forum headers from the index page. No other links will highlight red and be underlined, all other links are still highlighting blue.

Saurus, thank you very much as well, but your explanation was far too in depth and detailed for my pea brain to understand, lol. You ARE newer than me here, but your experience level with PHPBB/CSS codes is obviously way more advanced than anything I know. This is all foreign to me, this code stuff.

I really appreciate all the help as always, I'm pretty smart, but still, maybe I've done something wrong?

Sunny_D, I know you will figure this out for me, you have always been so good to me and explain things in a way that I can understand...sure hope you can figure this out for me.

Anyone who cares to take a look at my forum and see exactly what I mean, the address is: removed Please be kind, I know it's not a topic that most of you would care about or be interested in, but it's what I'm interested in and it's my forum. I think I've done a pretty good job so far, if I may say and for someone as clued out about these things as I am. I've really learned a tremendous amount from everyone here and it's thanks to what I have learned, read and seen that I have a forum that looks half way decent.

Thanks again Everybody!

The forum titles have a class and therefore an individual style for their own. Replace (again ) the code below with what you have already pasted in the CSS textfield. Your entire code should look like this:

Code:

a:link{color:#110BFF;text-decoration:none;}
a:visited{color:#110BFF;text-decoration:none;}
a:hover, a.forumtitle:hover{color:#110BFF;text-decoration:underline;}
a:active{color:#110BFF;text-decoration:none;}

Hi Sunny_D...thanks for replying and helping me again.

Unfortunately, that code didn't work either. When I replaced the code you supplied with this latest one, then no links were highlighted and underlined in red. Even my individual forum category titles went back to blue and underlined. Any other ideas or suggestions?

Heh, well, somehow I lost the info that you actually wanted it highlighted in red. I just used the color code you posted previously as you said that are the ones you want (those are all blue).

Code:


a:link{color:#110BFF;text-decoration:none;}
a:visited{color:#110BFF;text-decoration:none;}
a:hover, a.forumtitle:hover, a.topictitle:hover, .postprofile a:hover{color:#FF0B11;text-decoration:underline;}
a:active{color:#110BFF;text-decoration:none;}


This should make all links underlined in red when hovering and blue by default. If you spot a link that still acts all stubborn, post it here. But I think this code covers already all occuring links.

Thank you again for your patience - as explained in my pm.

Hi Sunny_D...

YEAH...SUCCESS! This code worked and is exactly how I wanted it... Thank you so much and for your patience and understanding :)

a:hover, a.forumtitle:hover, a.topictitle:hover, .postprofile

What the heck kind of class is THAT? No wonder I missed it:(

This is supposed to be the whole line (it's just displayed as two lines due to the forum width):

Code:

a:hover, a.forumtitle:hover, a.topictitle:hover, .postprofile a:hover{color:#FF0B11;text-decoration:underline;}

it's not a single class, of course, I'm just applying the same properties on 4 classes.

@Brad: You are welcome, glad it works.

Thanks Sunny_D it really worked well i was always confused with this matter,So i hope i can also make it Bold too.Can you suggest some more tips.
==================================================================
Peter



[link removed - don't spam]

peter8528 wrote:Thanks Sunny_D it really worked well i was always confused with this matter,So i hope i can also make it Bold too.Can you suggest some more tips.
==================================================================
Peter
[link removed - don't spam]

Which do you want bold? Just add

Code:

font-weight:bold

to the element you want to make bold. For future reference, here is a css tutorial on text elements...css text elements Insert it into the line in the same way the the tag for text-decoration is.

There are more helpful tutorials in the right sidebar.