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

Forums

Illustration by Nick Sirotich

Background image for active state

  • rjmccollam
    Permalink to comment #
    I am having a hard time coming up with a solution to add a triangle at the top of a thumbnail for this slider when it is the active thumbnail.

    You can view the slider being used here.

    I am using the featured content slider from CSS-Tricks and he has it working, but after altering code I am having issues getting it added.

    This is the CSS that I am using for the active state. I have some of what I should need in there to accomplish this, but not sure the best way to accomplish this.

    .active-thumb {background: url(images/slide-active.png) top center; width: 181px; border: 3px solid #ea5d10}


    Thanks for your help.
  • Hompimpa
    Permalink to comment # 
    .active-thumb:before{
    content:"";
    position: absolute;
    bottom: 100%;
    left: 46%;
    display: block;
    border-style: solid;
    border-width: 10px;
    border-color: transparent transparent #ea5d10 transparent;
    }
Add a Comment