Grow your CSS skills. Land your dream job.

Turned up Right Corner For Header Code?

  • MBM
    # October 24, 2012 at 5:33 pm

    Does anyone have a link or code for a top right turned up corner? I’ve played around with code from several tutorials but they’re for creating new containers, I want to add a folded corner effect to the top right corner of a header to give it some depth.

    #topHeader{
    margin-left:0px;
    width:1000px;
    height:128px;
    background:url(../images/banner.png) top left no-repeat;}

    # October 24, 2012 at 11:44 pm

    Can you post what you got on http://codepen.io/pen/ or http://jsfiddle.net/

    Maybe someone can help?

    # October 25, 2012 at 12:06 am

    Maybe this could help? http://matthamm.com/box-shadow-curl.html

    # October 25, 2012 at 6:45 am

    I assume you mean something like this: http://nicolasgallagher.com/pure-css-folded-corner-effect

    MBM
    # October 25, 2012 at 7:54 am

    Like that yes but I have an image in my header so that code doesn’t work.

    # October 25, 2012 at 7:59 am

    You can’t do that to an image in CSS.

    You could create a coloured ‘foldover’ (like this: http://codepen.io/Paulie-D/pen/FyDlw) but if that’s not what you want, you’ll just have to create a new image.

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.

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