dina Posted January 11, 2009 Report Share Posted January 11, 2009 Testing Testing HOMEABOUTCHATFORUMHELPCONTACT Testing Testing Testing Testing Quote Link to comment Share on other sites More sharing options...
Andrea Posted January 11, 2009 Report Share Posted January 11, 2009 It should be a colon instead of a period: #menu a.link { ---- and all the other a's (a:hover, a:visited, etc.) ---- should be #menu a:link { Quote Link to comment Share on other sites More sharing options...
dina Posted January 11, 2009 Author Report Share Posted January 11, 2009 Hi Thelma, Thank you very much, I changed it all and it still doesn't work, could there be any other cause perhaps. Quote Link to comment Share on other sites More sharing options...
Andrea Posted January 11, 2009 Report Share Posted January 11, 2009 Your link selectors also are in the wrong order - didn't pay attention to that last time. It has to be: link visited focus (if you use it) hover active You can remember that by: Lord Vadors Former Handle Annakin Quote Link to comment Share on other sites More sharing options...
virtual Posted January 11, 2009 Report Share Posted January 11, 2009 You have not given a colour to your hover and visited states, and you need to put # between the quotation marks in the link to make them work, as follows: HOME It is also a good idea to comment your closing div tags so that you can see at a glance if you have closed them propertly. Quote Link to comment Share on other sites More sharing options...
Bill Posted January 11, 2009 Report Share Posted January 11, 2009 Other than what Thelma already mentioned (changing the period to a colon, changing the order of the anchor states) remove @charset "utf-8"; from the top of your CSS. You can remove #menu a:link entirely and declare the styles for every anchor state just using #menu a. Then you only need to declare what changes in other states. Based on your existing CSS the only style change in any state other than the default is the font family. A font family that is more than one word must be enclosed in quotes in order to work. An anchor is an inline element. Applying width and height to an inline element has no effect. So you can remove the width and height declarations. (Unless you are planning on adding a background to make the links appear more as buttons, in which case you will need to add display: block; to #menu a and keep the width and height.) Focus should always be included along with hover, its not a matter of 'if you use it'. Hover only applieswhen using a mouse, focus will also include keyboard navigation. IE 6 treats :active as :focus so include that also to ensure your navigation is equally accessible to all users. #menu a { color: #fff; text-decoration: none; } #menu a:visited { /* add styles for visited links */ } #menu a:focus, #menu a:hover, #menu a:active { font-family: "bradley hand itc"; } Quote Link to comment Share on other sites More sharing options...
dina Posted January 12, 2009 Author Report Share Posted January 12, 2009 thanx to every one above for the help. I went and change every thing but still a few things Bill suggested didn't work like: 1) my color for visited added didn't take effect 2) my change of font-family didn't take effect either here is my new code: css #menu { width: 787; height: 50px; background: url(images/title.gif) repeat-x; } #menu li { float: left; width: 131px; padding-top: 0.7em; list-style-type: none; text-align: center; } #menu ul { display: inline; } #menu a { text-decoration: none; color: #FFF; } #menu a:visited { color: #22FF00; } #menu a:focus, #menu a:hover, #menu a:active { font-family: "bradley hand itc"; } thank you in advance for the support Quote Link to comment Share on other sites More sharing options...
Andrea Posted January 12, 2009 Report Share Posted January 12, 2009 It really would make helping so much easier if you could upload your page(s) somewhere..... Quote Link to comment Share on other sites More sharing options...
dina Posted January 13, 2009 Author Report Share Posted January 13, 2009 Hi Thelma, Yes I know exactly what your saying, it is a big schlep at the moment, but there is a problem that needs to be sorted out between my firewall, auto update and filezilla (which my server provider recommend for uploading). So until that is sorted I'm guna have to go this route, sorry! Quote Link to comment Share on other sites More sharing options...
falkencreative Posted January 13, 2009 Report Share Posted January 13, 2009 Either you'll need to figure out the FTP access first, or you'll need to post the complete code. Quote Link to comment Share on other sites More sharing options...
virtual Posted January 13, 2009 Report Share Posted January 13, 2009 I changed your font family and the new font now shows up. #menu a:focus, #menu a:hover, #menu a:active { font-family: chalkboard; } Quote Link to comment Share on other sites More sharing options...
Andrea Posted January 13, 2009 Report Share Posted January 13, 2009 Chalkboard will only actually appear if people have that font installed on their machines. Quote Link to comment Share on other sites More sharing options...
virtual Posted January 13, 2009 Report Share Posted January 13, 2009 Absolutely, the Bradley Hand ITC wasn't showing for me which is why I changed it to see if it was a problem with the font. I just chose Chalkboard at random because it is quite distinctive. Quote Link to comment Share on other sites More sharing options...
Andrea Posted January 13, 2009 Report Share Posted January 13, 2009 Makes sense to go with that for testing - about the Bradley Hand, could it have been the quotes that were missing in Dina's code? font-family: bradley hand itc; ?? (Also not sure that Bradley is a good choice due to above mentioned reason) Quote Link to comment Share on other sites More sharing options...
virtual Posted January 13, 2009 Report Share Posted January 13, 2009 She did put in the quotes, and funnily enough I do have it installed. I just looked at it and the full name is Bradley Hand ITC TT, so it does show up if I put the full name in. Dina, you are best to stick to basic fonts to avoid this issue, or use a selection of fonts e.g. font-family: "Bradley Hand ITC TT", Tahoma, serif; so that if they don't have the first font, or the second the browser will choose the default serif font in this case. Quote Link to comment Share on other sites More sharing options...
lm Posted January 13, 2009 Report Share Posted January 13, 2009 (edited) it is better not to mess up with hover state much in your menu bar - just give it some other color or underline it. May be for some fancy layout you can use in CSS: font-style: italic; or, if you go for extreme look - you can use images for menu bar as it is described in here Edited January 13, 2009 by lm Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.