Grow your CSS skills. Land your dream job.

Z-Index Blinking?

  • # November 22, 2011 at 1:15 pm

    I’m using z-index to make content inside (.under) appear above the image (.img img) on hover and I’m getting blinking. I don’t know how to stop the blinking, anybody? http://themeforward.com/demo2/portfolio/

    My CSS:


    #portfolio_content .img a {
    z-index:110!important
    }
    #portfolio_content .img a:hover { }
    #portfolio_content .img {
    display:block;
    float:left;
    height:210px;
    margin:0 35px 35px 0!important;
    overflow:hidden;
    padding:0;
    width:307px
    }
    #portfolio_content .img img {
    display:block;
    position:absolute!important;
    z-index:100!important
    }
    #portfolio_content .img img:hover { z-index:0!important }
    #portfolio_content .img .title, #portfolio_content .img .title a {
    font-size:22px;
    width:307px!important;
    height:210px!impotant;
    float:left!important;
    text-align:center;
    margin:100px 0 10px 0;
    position:relative!important
    }
    .desc {
    font-size:13px;
    display:block;
    text-align:center!important;
    margin:0 auto!important;
    width:307px
    }
    .under { width:307px; height:210px; background:#EEE; overflow:hidden; display:block }
    .under:hover { z-index:100!important }

    My markup:


    ">

    < ?php if ( has_post_thumbnail() ) { the_post_thumbnail( 'thmb-portfolio' ); } ?>




    < ?php the_title(); ?>



    < ?php echo get_post_meta( get_the_ID(), 'port_excerpt', true ); ?>




Viewing 1 post (of 1 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".