<style type="text/css">

.nav{

       font: 13px/27px "lucida grande",tahoma,verdana,arial,sans-serif;

       background-color: #2D2D2D;

       border-bottom: 1px solid #000000;

       font-size: 13px;

       height: 29px;

       position: relative;

       top: 0px;

       left:0px;

       width: 1060px;

       z-index: 990;

       }

        

.list_item{

       height:29px;

       cursor:pointer;

       float:left;

       text-align:center;

       display:inline-block;

       padding-left:10px;

       padding-right:10px;

       color:#AAAAAA;

       }

.list_item:hover{

       background:#4c4c4c; !important;

       }

.list_item_active {

       background:#4c4c4c; !important;

       border-top:2px solid red;

       height:27px;

       color:white;

       }

.search_box{

       margin-left:50px;

       border:1px solid transparent;

       width:300px;

       height:27px;

       background:whitesmoke;

       font-weight:bold;

       font-style:italic;

       padding-left:5px;

       border-radius:10px 10px 0px 0px;

       }

</style>



<html lang="de">

  <head>

    <meta charset="utf-8" />

    <title>jQuery Tutorial</title>

     

    <script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery/jquery-1.6.1.min.js"></script> 

    <script type="text/javascript"> 

    if (typeof jQuery == 'undefined') { 

        document.write(unescape("%3Cscript src='/js/jquery-1.6.1.min.js' type='text/javascript'%3E%3C/script%3E")); 

    } 

     

    $(document).ready(function() {

        $('.list_item').click(function() {

            $('.list_item').removeClass('list_item_active');

            $(this).addClass('list_item_active');

             

        });

    });

     

     

    </script> 

     

     

  </head>

 <body style="padding:px; margin:0px;background:whitesmoke;">

   

<div class="nav">

    <div class="list_item list_item_active"> Web </div>

    <div class="list_item"> Nachrichten </div>

    <div class="list_item"> Einladungen </div>

    <div class="list_item"> Neuigkeiten </div>

     

    <input type="text" class="search_box" placeholder="Suche..."/>

     

    <div class="list_item" style="float:right;"> Abmelden </div>   

</div> 

   

</body>

</html>