PDA

View Full Version : Issue with links on my pages...Help!



grahamy84
11-20-2009, 01:33 PM
Hi all,

I have a problem with my links on my pages: www.caffevinci.com

They're appearing as an underline but I only want them to have an underline when the mouse hovers over them. And I don't want them to change at all once they've already been selected (e.g. I don't want them changing to a different colour)

The other problem is, I have different links at the bottom of the page which I want styled differently. In Firefox they are working fine but in IE they are changing to a blue colour once selected.

Please help!

Here is my style sheet: http://www.caffevinci.com/stylesheet.css

abduraooft
11-20-2009, 01:52 PM
They're appearing as an underline but I only want them to have an underline when the mouse hovers over them. And I don't want them to change at all once they've already been selected (e.g. I don't want them changing to a different colour)
You may define specific rules using the anchor pseudo classes, refer http://www.w3schools.com/CSS/css_pseudo_classes.asp

The other problem is, I have different links at the bottom of the page which I want styled differently. In Firefox they are working fine but in IE they are changing to a blue colour once selected.
IE requires the anchor pseudo classes in the order link, visited, hover, active (LoVe-HAte). So, we need to add them in order in our CSS, even though some of them do not contain any specific css properties.

grahamy84
11-20-2009, 02:25 PM
How do I link "Home" and "Resources" at the top of the page without making their font size/color change (I'd only want it to change to the red colour on rollover)? http://www.caffevinci.com/links_hotels.html

This is the code:


.cssDivNavigations_StorePage {
width: 800px;
margin-bottom: 10px;
padding-bottom: 5px;
border-bottom-style: solid;
border-bottom-color: #BF0D0D;
border-bottom-width: 1px;
vertical-align: top;
text-align: left;
line-height: 14px;
font-family: "Times New Roman",Times,serif;
font-size: 10px;
font-weight: bold;
color: #000000;
}

tomws
11-20-2009, 03:16 PM
The link abduraooft gave you has the answer. Use :hover.

grahamy84
11-20-2009, 03:56 PM
The link abduraooft gave you has the answer. Use :hover.

Do I just insert it into the CSS above?

Rowsdower!
11-20-2009, 03:59 PM
Read the page abduraooft gave you and try the demo there. This is something that you should learn and it won't take you long to understand it.