• Resolved c

    (@igneous)


    I have this in my css, to make my visited links black when people have visited them. Then problem is that is applies to everything, I only want it to apply to the links in my wordpress posts, not every link on the site.

    a.active,a.visited,a:active,a:visited {
    color:#000!important;
    }

    Is there a simple change to that CSS so the visited links are black, but only within my post content?
    Thanks

Viewing 9 replies - 1 through 9 (of 9 total)
  • Probably, but specifics depend on your theme and site.

    It’s always helpful to post a link to your site when asking a question. It makes it easier to provide specific suggestions.

    For properly constructed themes which call the body_class() function, the body element will be assigned a class called single-post on single post pages, so to target just single post pages, add the .single-post class to the selector:

    a.active, .single-post a.visited {
    color:#000;
    }

    Note: not sure why you duplicated the first two selectors, so I took out the dupes.

    Note2: you should avoid the use of the !important clause. Whenever I see it, it makes me wonder if the designer doesn’t understand CSS specificity. Using it may create problems in the future. For example, let’s say you want the links in your post content to be black, but red in the widgets or footer. Then you’ll have to write another rule using the !important clause. Best to use a selector with enough specificity to override whatever existing rule there is instead of relying on !important to be a fix-all solution.

    Thread Starter c

    (@igneous)

    Thanks!
    That didnt seem to fix it, so I assume something(shockingly) it wasn’t coded correctly. This is the page:
    https://www.freestufftimes.com/free-money/
    My CSS for links are:

    a {
    color:#6d9337;
    }
    a.active,a.visited,a:active,a:visited {
    color:#000!important;
    }

    Oh and sorry about the confusion, I didnt mean only on the single post page, I meant only within the post content. So it won’t affect links on the menu and sidebar, just within actual post content.

    Thanks for your info.

    For all post content area you can define attribute for visited like this:

    #content a {
    color:#6d9337;
    }
    #content a.active,a.visited,a:active,a:visited {
    color:#000!important;
    }

    Hope this will solve your problem.

    Not quite. The first selector would make active links black in the content area, but the second selector would make all visited links black, not just the content area. Copy the #content ID to before the a:visited selector like this (plus, there should be a colon between the element and active or visited pseudoclasses, not a period):

    #content a:active, #content a:visited {
    color:#000;
    }

    Thread Starter c

    (@igneous)

    That did it, thank you CrouchingBruin!

    Thread Starter c

    (@igneous)

    I found a problem with that code. It doesn’t seem to apply to single posts. I’m trying to figure out what the single post code might be, but havent been able to figure it out yet.
    I tried: #content .single-post a:visited and a bunch of others and it didn’t work. Is it something close to that?

    Try this instead:

    #content a:active, #content a:visited, #single-holder a:visited {
    color:#000;
    }

    Thread Starter c

    (@igneous)

    Perfect, thanks ??

Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘CSS for visited links?’ is closed to new replies.