I Am Stuck

programming web dev
1

Hi,
I am supposed to design button that look like

[without the black border kirupa adds it own]

I am having real trouble designing it, can any one assist me please. I am also using twitter bootstrap scaffold.

this is what i have tried



<style>
ul#avmenu 
    {
        margin: 35px 0;
        padding: 0;
        font: 12px Verdana;
        list-style-type: none;
    }
 
    ul#avmenu li 
    {
        display: inline;
    }
     
    ul#avmenu li a 
    {
        padding: 5px 10px;
        
        background-color: #fdbf50;
        color: #47a;
        text-decoration: none;
    }

    ul#avmenu a:hover 
    {
        background: #fff;
        color: #222;
    }
    ul#avmenu li.current a 
    {
        border:1px solid #777;
    }
</style>
<div id="navigation" class="span12 ">
            <ul id="avmenu">
              <li class="current"><a href="home">Home</a></li>
              <li><a href="flights">Flights page</a></li>           
              <li><a href="about-us">About Us</a></li>
            </ul>
</div>

What am i doing wrong?