| | |
CSS external style sheet EW2 can not use a:hover etc
Please support our HTML and CSS advertiser: $6.99 Domain Names at 1&1. Includes Free Privacy. Save Now!
Thread Solved |
•
•
Join Date: Aug 2007
Posts: 118
Reputation:
Solved Threads: 0
Hi
I am using MS Expression Web 2 migrating from Frontpage 2002. I have decided to try to produce an up to standards web site using CSS and this doctype:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
-as suggested by an article Getting Started or similar that I think I read on a MS blog.
I am having quite a lot of trouble and wish I had stuck to tables for layout! But I have made progress as Expression Web 2 is very nice to use.
I am currently stuck on designing a horizontal navigation bar. I have used the DL tag in the HTML and a class called "menu" for the formatting. I can't add
"a:hover" though or any of the other hyperlink formatting commands to the CSS file. EW2 justs underlines the "a" as being not acceptable. It won't accept any code beginning
with "a" in the CSS at all. As soon as I type "a" it unlines it as being unacceptable. My CSS file uses "link rel . . " in the web pages.
Consequently I have added a style sheet to the web page in the Head section using the File - Properties dialogue. since every page of the web will have the same
navigation bar it does seem silly not to be able to include the code in the CSS external file though. Does anyone know what I am doing wrong?
I am using MS Expression Web 2 migrating from Frontpage 2002. I have decided to try to produce an up to standards web site using CSS and this doctype:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
-as suggested by an article Getting Started or similar that I think I read on a MS blog.
I am having quite a lot of trouble and wish I had stuck to tables for layout! But I have made progress as Expression Web 2 is very nice to use.
I am currently stuck on designing a horizontal navigation bar. I have used the DL tag in the HTML and a class called "menu" for the formatting. I can't add
"a:hover" though or any of the other hyperlink formatting commands to the CSS file. EW2 justs underlines the "a" as being not acceptable. It won't accept any code beginning
with "a" in the CSS at all. As soon as I type "a" it unlines it as being unacceptable. My CSS file uses "link rel . . " in the web pages.
Consequently I have added a style sheet to the web page in the Head section using the File - Properties dialogue. since every page of the web will have the same
navigation bar it does seem silly not to be able to include the code in the CSS external file though. Does anyone know what I am doing wrong?
•
•
Join Date: Aug 2007
Posts: 118
Reputation:
Solved Threads: 0
I found that it is possible to by using "Manage Styles" to move a style from an internal CSS to an external CSS or vice versa -just be dragging it. So I dragged it from the page to the external CSS to the class "menu" It worked but didn't put it in the "menu" class but just above it. I have now added the code for "visited" and it works.
I am a little wiser, I think? But is there some order in which a style is added to the external CSS? And what's the best way of working -work at page level and move internal defined styles to the external file?
I am a little wiser, I think? But is there some order in which a style is added to the external CSS? And what's the best way of working -work at page level and move internal defined styles to the external file?
If you used class menu directly on a element, then instead of using a:hover in your css, you should use .menu:hover, .menu:visited, etc...
On the other hand, if you have applied menu class to your DL tag, then you should define your links like
.menu a:link, .menu a:visited, etc...
On the other hand, if you have applied menu class to your DL tag, then you should define your links like
.menu a:link, .menu a:visited, etc...
" Of all the things I've lost,
I miss my mind the most...."
Mark Twain
I miss my mind the most...."
Mark Twain
To your last you have just posted.
the correct order to define styles for a link is
a:link, a:hover, a:visited and optionally a:active
As for the question where to do css coding - inside page or in an external file - it is easier to work with an external file, because you can keep both files opened one next to other and you will not have to scroll up and down as you would do with a single file.
the correct order to define styles for a link is
a:link, a:hover, a:visited and optionally a:active
As for the question where to do css coding - inside page or in an external file - it is easier to work with an external file, because you can keep both files opened one next to other and you will not have to scroll up and down as you would do with a single file.
" Of all the things I've lost,
I miss my mind the most...."
Mark Twain
I miss my mind the most...."
Mark Twain
•
•
Join Date: Aug 2007
Posts: 118
Reputation:
Solved Threads: 0
•
•
•
•
If you used class menu directly on a element, then instead of using a:hover in your css, you should use .menu:hover, .menu:visited, etc...
On the other hand, if you have applied menu class to your DL tag, then you should define your links like
.menu a:link, .menu a:visited, etc...
I have the menu class applied to the DL tag and have added the code as you have suggested and it works fine.
•
•
Join Date: Aug 2007
Posts: 118
Reputation:
Solved Threads: 0
•
•
•
•
To your last you have just posted.
the correct order to define styles for a link is
a:link, a:hover, a:visited and optionally a:active
As for the question where to do css coding - inside page or in an external file - it is easier to work with an external file, because you can keep both files opened one next to other and you will not have to scroll up and down as you would do with a single file.
a:link, a:visited, a:hover and a:active; otherwise the hover won't work after the link's been visited. ( I checked on w3schools)
Thanks for the advice about which is easier. And thanks once again for helping me with this - it was keeping me awake at night!
Geoff
![]() |
Other Threads in the HTML and CSS Forum
- Previous Thread: how to code textcolor in html
- Next Thread: Layout Sample #2
Views: 1346 | Replies: 5
| Thread Tools | Search this Thread |
Tag cloud for HTML and CSS
alignment background beta blog browser browserproblems cart cascade center chrome code compatibility containers create css deleted design designing distortion div division dreamweaver drupal editor emailmarketing embed explorer fail firefox float font fonts format free google helprequired-urgent hover html ide ie6 ie7 iframe image images input internet internetexplorer iphone javascript jpeg js links map maps margin marketshare missing mozilla mp3 navigationbars newb object opacity opera override overwrite perl player pnginie6 positioning prevent problem scroll seo shopping strings studio style table tables tag templates text theme tips translation url validation visual visualization w3c web webform website word wordpress xhtml xml xsl youtube





