[CSS] Podkreślenie opcji w menu, tylko do połowy Opcje

[lukash82]

Witam,

Potrzebuję uzyskać efekt podkreślenia wybranej opcji w menu nawigacyjnym strony. Mam coś takiego (pracuję na BS 3.3).

[CSS] pobierz, plaintext 
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
	  border-bottom: 3px solid #9e1e22;
}
[CSS] pobierz, plaintext 

Podgląd tu

W ten sposób jednak podkreślenie widoczne jest pod całą nazwą. Grafik wymyślił sobie podkreślenie tylko do określonej długości (bo jest ładniej (IMG:style_emoticons/default/wink.gif) . Pytanie jednak czy to jest wogóle fizycznie możliwe...?

Próbowałem podkładać jakieś div-y z wypełnieniem i padding-ami ale bez efektów. Border-width z różnym jednostkami też nie działa. Obawiam się, że bez js się nie obejdzie...

Pozdrawiam, Ł.