How to code certain css shapes?

Question

I am trying to make the shape below in CSS. Any ideas how to do this? Or know a tutorial site that can help? I am talking about the tag like shapes that are yellow.

Answer 1

To answer your second question first, you use border-radius

div{
    border:1px solid black;
    border-radius:0 0 4px 4px;
    -moz-border-radius:0 0 4px 4px;
    -webkit-border-radius:0 0 4px 4px;
    height:100px;
    width:100px;
    margin:2em;
}

The -moz and -webkit are specific vendor prefixes.

You can change the numbers as you wish, but they follow this pattern

1st # = top left corner
2nd # = top right corner
3rd # = bottom right corner
4th # = bottom left corner

Example: http://jsfiddle.net/9VbFn/

As for the first question, here is a tutorial to help you

http://debiprasad.net/coding-and-logic/create-a-price-tag-using-css