Welcome to WebmasterWorld Guest from 54.198.15.59

Forum Moderators: not2easy

Message Too Old, No Replies

Using hover syntax inline?

Defining hover attribute within a HTML tag

     
12:31 am on Feb 12, 2003 (gmt 0)

Junior Member

10+ Year Member

joined:May 31, 2002
posts:157
votes: 0


Hello all,

I use a free mailing list service to deliver my html newsletters, but they strip my <head> tags completely, forcing me to do all my CSS coding inline.

The first problem I came across during my recoding is that the "hover code" is not recognized when using CSS to define the properties of a link. Here's an example:

href="http://xxxxx" style="link, visited, active {font: 11px geneva, verdana, arial, sans-serif; color: #8BC7FF; text-decoration: none;} hover {font: 12px geneva, verdana, arial, sans-serif; color: #FF0000; text-decoration: none;}
"

When I remove the hover syntax it works fine, but with it it bombs out. Is it possible to use the hover feature inline, or will it only work as defined within the <head><style>...</style></head> tags?

12:39 am on Feb 12, 2003 (gmt 0)

Senior Member

WebmasterWorld Senior Member 10+ Year Member

joined:Apr 22, 2002
posts:2546
votes: 0


Unfortunately, I don't think so but if someone knows how, I would love to know also.
10:29 am on Feb 12, 2003 (gmt 0)

Senior Member

WebmasterWorld Senior Member blobfisk is a WebmasterWorld Top Contributor of All Time 10+ Year Member

joined:Feb 25, 2002
posts:3185
votes: 0


I've only tested this in IE6 and Mozilla, but if you put your anchor pseudo-classes in a <style type="text/css">...</style> in your html (ie right below you <body> tag), this will style your links correctly.

Again, the caveat being that I only tested this in IE6 and Mozilla... not in any email application.

11:25 am on Feb 12, 2003 (gmt 0)

Senior Member

WebmasterWorld Senior Member 10+ Year Member

joined:July 3, 2002
posts:1590
votes: 0


BlobFisk- that will work fine in most big email apps (hotmail, yahoo, outlook).

When using inline styles like this in emails you have to remember to apply they styles actually in the body as well (so its no good defining td, tr, p etc in the head). I.e. you have to go <span class="whateveryourclassis"> for every single thing you've defined- otherwise your inline styles will be overrided by the email provider's (say hotmail or yahoo's) own stylesheet.

9:50 pm on Feb 12, 2003 (gmt 0)

Senior Member

WebmasterWorld Senior Member drdoc is a WebmasterWorld Top Contributor of All Time 10+ Year Member

joined:Mar 15, 2002
posts:6807
votes: 0


Well, here's something that would work .. It's not pretty, and it's a pain if you have a ton of links.

Anyway, why not do this?

<a href="#" onmouseover="this.style='...'">Test</a>