Question

How do you create a tapered css border like around the top of the body of http://www.khanacademy.org.
It looks like they’re doing something with the margin, but when I copy it to mine it doesn’t work. Here’s my css:

#center{
    margin:0 1px;
/*  margin-top: 0px; the part I copied from KhanAcadmey
    margin-right:1px;
    margin-left: 1px;
    margin-bottom:1px;*/    
    border-left:1px solid #3D3D3D;
    border-right:1px solid #3D3D3D;
    float:left;
    width:46%;
    height:100%;
    z-index:5;
}

Answer 1

Take a look at #page-container and #page-container-inner. It looks like the tapered border is done using two images: one for the left border and one for the right.