treehouse : what would you like to learn today?
Web Design Web Development iOS Development

How to solving : CSS selector “:active” not working ?

  • I'm very confused, because :hover selector was working normaly, but active not working.
    The code:

    ::CSS::
    #working
    #selec:hover{background-color:blue;}

    #not work
    #selec:active{background-color:red;}


    ::PHP::
    <a href="?room=<?php echo $ID;?>"><div id="selec"><?php $name;?></div></a>


    Anyone can help me? Thank you
  • JuanLie, you really need to better explain the problem and give some code or link.

    I'll take a guess and assume you think that the active psuedo class should work for navigation when on a certain page - it doesn't. Active is when the link or element is actually being selected, like when you're mouse clicking on a link.

    If this is true, then simply use php to add an active class to the link or div in question
  • I guess if you do it like this it won't work:
    http://codepen.io/AntonNiklasson/pen/21/2

    If that's you problem, put the :active below the :hover.
  • @wolfcry911 : would you please to solve my problem, please?
    @AntonNiklasson : its same, not working, I have gave up for this problem :(.
  • I have had this problem before. I believe you need to order them correctly. link, active, hover, visited. Hover will work by itself, but active and visited will only work if it follows link.
  • Yes, the order in which you style the links matters.

    But I thought the recommended order is link, visited, hover, focus, active (I remember it with Lord Vader's Handle Formerly Annakin). Am I wrong? Has that changed?