Snoggi: Problem mit Navbar bei Zeilenumbruch

Beitrag lesen

Hallo
Ich habe ein Problem bei einer Navigationsbar.

Hier seht ihr das Problem. Die Navbar funktionierte gut, bis ich auf einmal einen solangen Link hatte, dass ich einen Zeilenumbruch brauchte. Jetzt weiß ich aber nicht, wie ich es hinbekomme, dass die Schrift wieder linksbündig ist und der hover und active Effekt mit dem weißen Hintergrund bis oben an den Rand gehen.

So sollte das optimalerweise aussehen.

Der CSS-Code der Navbar ist folgender:

.navbar3 {
background-color: #EDEFF7;
border: 1px solid gray;
float: right;
width: 840px;
margin: 6px;
padding: 0;
height: 54px;
}

.navbar3 ul.nav {
 list-style-type: none;
 padding: 0;
 margin: 0;
 }

.navbar3 ul.nav li {
 display: inline;
 margin: 0px 15px 0px 10px;
 padding: 3px 10px 2px 10px;
 }

.navbar3 ul.nav li {
 width: 15px;
 text-align: left;
 height: 40px;
}

.navbar3 ul.nav a {
color: gray;
text-decoration: none;
text-align: center;
padding: 1px 10px 2px 10px;
border: 1px solid #EDEFF7;
}

.navbar3 ul.nav a:hover  {
background-color: white;
color: #2C74B4;
border: 1px solid gray;
padding: 1px 10px 2px 10px;
border-top: none;
}

Weiß da jemand Rat?