CSS a: hover style and automatic text color issues

[Brightbelt]

Hi-
I'm on FP 2003 and win XP Pro. I'm setting up modem
speed hyperlinks (eg, "14k - 56k - Dsl/Cab") for audio
clips with a CSS a: hover style for a mouse-over-
color/underline effect. My problem is that the mouse over
color and underline work fine but only when the original
text is set to automatic. But I want a different original
color or different automatic color because of a conflict
with my page color. Is there a way to change the
automatic color for text, at least on a page ? I've
looked over and over in all the options/page options/site
settings menus and I see nothing, except color-coding for
code text.
Just to make sure I'm doing the CSS correctly, let me
list how I'm doing it: I highlight the hyperlink(s), and
choose 'Style' from the main Format menu: choose the html
tag "a: hover" and click 'Modify'; click
format/choose 'Font' and then set the size, new color and
check the box for the underline effect; click Ok all the
way out and I'm there.
I haven't published the changes I'm working on because
other stuff is still in process but I will if I have to
to help this process out. Btw, I already have the code
for this CSS that was offered to me thru this newsgroup a
little while back, but I'm not a coder and would prefer
help directed in reflection of that fact. Thanks for your
help,...Brightbelt

 

[Steve Easton]

Set a ccs style for each link "condition." Since it is just for links the
following will work.
Place it between the head tags.
Modify the colors as desired and also the text-decoration:

<style type=text/css>
a{
text-decoration: none;
}
a:link {
background-color: transparent;
color: #0000FF;
text-decoration: underline;
}
a:visited {
background-color: transparent;
color: teal;
text-decoration: none;
}
a:hover {
background-color: transparent;
color: #FF0000;
text-decoration: underline;
}
</style>


--
Steve Easton
Microsoft MVP FrontPage
95isalive
This site is best viewed..................
...............................with a computer

 

[Brightbelt]

Hi Steve-
I did what you suggested and have published the site
ahead of time so you could see what's happening - it
still doesn't work - I only get an underline effect on
the rollover. Could this have something to do with the
fact that I used Jbots code for this before and it's
still lingering in the code somewhere ?....I don't know.
I've deleted and erased the Jbots code as far as I can
tell. Here's the Url
Http://www.brightbeltmusic.com/Jazz_Links.htm Thanks for
your help,...Brightbelt

 

[Jack Brewster]

After taking a quick look at your CSS I think your problem is because you
have "text-decoration: none" on everything EXCEPT :hover where you have
"text-decoration: underline".

All those "none" declarations are turning off your underlining.

As Steve mentioned:
"Modify the colors as desired and also the text-decoration:"

Since it sounds like you want the links to always be underlined, I'd suggest
this modification to Steve's code. Note that this _does_not_ take into
account any changes that you have already made on _your_ page. This is just
an edit of Steve's original suggestion. You will still need to make changes
to the color, etc.

<style type=text/css>
a{
text-decoration: underline;
}
a:link {
background-color: transparent;
color: #0000FF;
}
a:visited {
background-color: transparent;
color: teal;
}
a:hover {
background-color: transparent;
color: #FF0000;
}
</style>

 

[Steve Easton]

In addition to what Jack wrote.
You have inline class names applied to each link.
The in line classes will over ride the styles set in the style script.

My recommendation: completely remove the links, save the page, redo the links
and then the style will work.

--
Steve Easton
Microsoft MVP FrontPage
95isalive
This site is best viewed..................
...............................with a computer

 

[Jack Brewster]

Good catch, Steve. I only looked at the CSS block, not at the actual HTML.

 

[Brightbelt]

Hi Jack-
I think I wasn't very clear explaining what I wanted. I
do want the underline ONLY on the hover, but I ALSO want
the color change (to red) (only) on the hover - I'm not
getting that result even though it's in the code. I want
the original link to be black or dark grey and the
visited link to be teal. If you look at my code, I think
the color/underline choices are there correctly and are
in accordance with what I'm saying but they still are not
working for some reason. I hope this clarifies where I'm
at and helps you help me !! Thanks,...Brightbelt

 

[Brightbelt]

Hey, so you know-
I've tried different shades of red; I've tried typing
the color numbers directly into the code; I also changed
the color word 'teal' (visited link color) in the code
with the correct color # (008080) just to be safe, in
case that was messing up anything. I've tried typing the
numbers from my number pad instead of the main keyboard
numbers. So I'm out of ideas,...Any other ideas are
welcome ! Thanks,...Brightbelt

 

[Steve Easton]

In addition to what Jack wrote.
You have inline class names applied to each link.
The in line classes will over ride the styles set in the style script.

My recommendation: completely remove the links, save the page, redo the links
and then the style will work.

--
Steve Easton
Microsoft MVP FrontPage
95isalive
This site is best viewed..................
...............................with a computer

 

[Steve Easton]

In addition to what Jack wrote.
You have inline class names applied to each link.
The in line classes will over ride the styles set in the style script.

My recommendation: completely remove the links, save the page, redo the links
and then the style will work.


--
Steve Easton
Microsoft MVP FrontPage
95isalive
This site is best viewed..................
...............................with a computer

 

[Brightbelt]

Hi Steve and Jack-
Thank you both,...that was the answer I didn't want (re-
doing all the links !) but it did work; I finally got it
set the way I wanted. I had a feeling about all that code
(Inline class names etc) - it was left over from Jbots I
think. I'm glad for this method; it seems more
streamlined. Again, Thanks to you both,...Brightbelt

 

[Jack Brewster]

Here's a page with what you're asking for. It's straight HTML with embedded
CSS:
http://www.maxgeek.com/frontpage/brightbelt.htm

You need to ensure that you don't have any conflicting styles that may be
caused by the included Dreamweaver style changing JavaScript. If you can't
get my sample code to work then you should take Steve's advice to remove all
the links, styles, js code, etc.