#1
  1. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jul 2003
    Posts
    97
    Rep Power
    12

    CSS color problem on black ground


    hi. i created a menubar that has different properties when you hover, visited, etc in css. it's pretty much your standard menubar with different colors you see on the net. it works fine on my pages who's background colors are white, off-white, blue... everythinb BUT BLACK. for some reason, on the black ground, it goes to the standard purple/blue/text-underline schemes. is there a way to get around that?

    also, in css, do you treat a "mailto" the same as a normal "href"?
  2. #2
  3. 4:04 Time Not Found
    Devshed Regular (2000 - 2499 posts)

    Join Date
    Jan 2004
    Location
    Northern Virginia
    Posts
    2,273
    Rep Power
    338
    I'm not sure what the issue is with the colors reverting to the standard scheme, do you have an example?

    Since mailto tags live in A tags, they are treated the same. You, of course, could do a seperate className for your mailto links...
    Code:
    <a href="http://localhost/" class="normal">my computer</a>
    <a href="mailto:root@localhost" class="mailto">Email me</a>
    I am so smart, I am so smart, S.M.R.T ... I mean S.M.A.R.T.

    Stop Using Pop-Ups
  4. #3
  5. Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Sep 2003
    Location
    Orange County, CA
    Posts
    101
    Rep Power
    12
    Originally Posted by jwfc
    also, in css, do you treat a "mailto" the same as a normal "href"?
    well, seeing as how the href=" preceeds the mailto:, it will be treated as a link and all of the :visited/:hover/etc attributes should apply.

    I'm not sure exactly how to help in your situation, because i have no page (or source) to look at. You should only need a class name for your links if you only want a few specific links to carry specific styles. if you are wanting the style to apply to all links, you only need to use the css selector a {}. for instance, say you want all of the links to be puke green with no underline on the page, you want the :hover state to be a lighter green with an underline, and you want to change the link to your normal black text after it has been hit so your readers eyes aren't distracted. Your CSS would look something like:
    Code:
    a {
      color: #99CC00;
      text-decoration: none;
    }
    a:hover {
      color: #99CC99;
      text-decoration: underline;
    }
    a:visited {
      color: #000000;
      text-decoration: none;
    }
  6. #4
  7. Thanks Johnny Hart (BC) R.I.P.

    Join Date
    May 2003
    Location
    Dallas
    Posts
    5,268
    Rep Power
    1956
    Except that :visited should precede :hover. Otherwise, a hover state would be overridden by the visited state. Think priorities and the cascade.

    cheers,

    gary
    There are those who manage to build a web site without knowing what they're doing; thereby proving to themselves they do, indeed, know what they're doing.

    My html and css workshop, demos and tutorials.
    Ask a better question, get a better answer.
  8. #5
  9. Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Sep 2003
    Location
    Orange County, CA
    Posts
    101
    Rep Power
    12
    Originally Posted by kk5st
    Except that :visited should precede :hover.
    Argh! I can't belive i did that. Talk about laying the proverbial forum smackdown . Oh well, second what kk5st said.

    as for your page:

    1. linksCSS.css does not need, nor should it ever have, any html tags. So, take out the <html>, <head>, <title>, <style> and <!-- --> tags.

    But that is not the problem you have, it's just bad form.

    2. you have to specify the location of your style sheet for every page. For instance:
    pageA.html is in the "/" directory, pageB.html is in the "/example/" directory, and your style sheet is in the "/stylesheet/" directory.
    Code:
    for pageA.html
    <link rel="stylesheet" href="stylesheet/stylesheet.css" media="screen">
    
    for pageB.html
    <link rel="stylesheet" href="../stylesheet/stylesheet.css" media="screen">
    As a side note, if you have images, you would follow the same convention. if you have a page 4 directories deep and an image that is in your root directory it would look as such: <img src="../../../../image.jpg" alt="image" />

    I hope that helps.
    Last edited by kcocgibkcusuoy; May 13th, 2004 at 10:03 AM. Reason: spelling and grammar.

IMN logo majestic logo threadwatch logo seochat tools logo