Выступающий край в меню

[nevajno22]

PHP код:


#navigation {
    border-radius: 5px;
    width: 950px;
    height: 35px;
    margin: 0;
    padding: 0;
    background-image: url(images/navigation_bar.png);
    background-repeat: no-repeat;
    background-position: left top;
} 
#navigation ul {
    list-style: none;
    margin: 0;
    padding: 0;
} 
#navigation ul li {
    display: inline;
    margin: 0px;
} 
#navigation ul li a {
    height:26px;
    display: block;
    float: left;
    color: #FFF;
    text-decoration: none;
    font-family: Arial;
    font-size: 13px;
    font-weight: bolder;
    background-image: url(images/menu_separatorline2.jpg);
    background-repeat: no-repeat;
    background-position: right center;
    padding-top: 9px;
    padding-right: 15px;
    padding-bottom: 0;
    padding-left: 15px;
    
} 

#navigation ul li a:hover {
    color:#FFF;
    background-image: url(images/button_hover3.png);
    background-repeat: repeat-x;
    background-position: left top;
    
    
    }



#navigation ul li#active a {
    color:#FFF;
    background-image: url(images/menu_separatorline.jpg);
    background-repeat: repeat-x;
    background-position: left top;
    
}


      <div id="navigation">
            <ul>
                <li2><a href="#">Home</a></li>
                <li id="active"><a href="#">About us</a></li>
                <li><a href="#">Services</a></li>
            <li><a href="#">Portfolio</a></li>
                <li><a href="#">Clients</a></li>
        <li><a href="#">News & Events</a></li>
        <li><a href="#">Contact</a></li>
            </ul>
      </div> 


Народ вот мое скромное меню с закругленными краями,при наведении на элемент он подсвечивается(но края острые).Проблема в том что когда наводиш(подсвечиваеш) крайний левый элемент то его острые края вылезают за границу самого закругленного меню,как зделать закругленные края именно на левом элементе и только слевой стороны?Вариант зделать закругленными все элементы не подходит.

[Naive]

#navigation ul li:last-child{
    -webkit-border-radius:0 5px 5px 0;
     -khtml-border-radius:0 5px 5px 0;
       -moz-border-radius:0 5px 5px 0;
            border-radius:0 5px 5px 0;
}

для ие6-8 скриптом

[nevajno22]

Сообщение от Naive

#navigation ul li:last-child{
    -webkit-border-radius:0 5px 5px 0;
     -khtml-border-radius:0 5px 5px 0;
       -moz-border-radius:0 5px 5px 0;
            border-radius:0 5px 5px 0;
}

для ие6-8 скриптом

Класс,спасибо!