The Lodge is members-only design/dev videos and Office Hours.

Next Office Hours Session: "Implementing an SVG Icon System" Nov 30 - 6:00 PM Eastern

Border around css-generated trapezoid

  • # March 22, 2013 at 4:00 pm

    Hello everyone,

    So I’m trying to put a 1px black border around a trapezoid generated like this:

    border-top:80px solid #C1C1C1;
    border-left:45px solid transparent;
    border-right:45px solid transparent;
    padding:0 8px 0 0;

    But of course I’m already using borders for the trapezoid, so is there any way to ether generate the trapezoid differently or apply the 1px border differently?

    Any feedback is much appreciated,


    # March 22, 2013 at 4:08 pm

    This reply has been reported for inappropriate content.

    pseudo element

    The math isn’t right for a 1px border, but the principle is there.

    # March 22, 2013 at 4:35 pm

    Awesome, Thanks!

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

You must be logged in to reply to this topic.

There's a whole bunch of content on CSS-Tricks.

Search for Stuff   •   Browse the Archives

Get the Newsletter ... or get the RSS feed