WN - ul li menu

WN (https://www.wn.se/forum/index.php)

- Klientsidans teknologier, design och grafik (https://www.wn.se/forum/forumdisplay.php?f=12)

- - ul li menu (https://www.wn.se/forum/showthread.php?t=1054199)

jag har en meny som ser ut såhär:

Kod:

<ul>

                                        <li><a href="#" class="active"><span style="padding:2px;display:block;"><span class="inner_menu active_inner_menu">Startsida</span></span></a></li>

                                        <li><a href="#"><span style="padding:2px;display:block;"><span class="inner_menu">Turnering/Cup</span></span></a></li>

                                        <li><a href="#"><span style="padding:2px;display:block;"><span class="inner_menu">Lag</span></span></a></li>

                                        <li><a href="#"><span style="padding:2px;display:block;"><span class="inner_menu">Forum</span></span></a></li>

                                        <li><a href="#"><span style="padding:2px;display:block;"><span class="inner_menu">Bli medlem</span></span></a></li>

                                        <li><a href="#"><span style="padding:2px;display:block;"><span class="inner_menu">Om oss</span></span></a></li>

                                        <li><a href="#"><span style="padding:2px;display:block;"><span class="inner_menu">Kontakt</span></span></a></li>

                                        <li"><a href="#"><span style="padding:2px;display:block;"><span class="inner_menu">                 </span>här ska det inte synas något men denna li skall fyllas ut till höger så långt det bara går</span></a></li>

                                </ul>

Den sista li har jag tönkt skall fylla ut resten av <ul>. Men jag får det inte att funka :(

Om du sätter bredden på ul till 100% och fast bredd på de andra li-elementen?

Förstår inte, varför är det nödvändigt att få den sista li att fylla ut ända till höger?

Om det är så att element sätter sig på höger sida om menyn om menyn inte är fullt utfyllt, kör då med en div runt ul, så blir det 100%, och inget element kan komma till höger om menyn. Om du förstår. :)

http://derp.se/derp/

löste det genom att sätta en bg bild på ul

Citat:

Ursprungligen postat av frecka (Inlägg 20445049)

jag har en meny som ser ut såhär:

Kod:

<ul>

                                        <li><a href="#" class="active"><span style="padding:2px;display:block;"><span class="inner_menu active_inner_menu">Startsida</span></span></a></li>

                                        <li><a href="#"><span style="padding:2px;display:block;"><span class="inner_menu">Turnering/Cup</span></span></a></li>

                                        <li><a href="#"><span style="padding:2px;display:block;"><span class="inner_menu">Lag</span></span></a></li>

                                        <li><a href="#"><span style="padding:2px;display:block;"><span class="inner_menu">Forum</span></span></a></li>

                                        <li><a href="#"><span style="padding:2px;display:block;"><span class="inner_menu">Bli medlem</span></span></a></li>

                                        <li><a href="#"><span style="padding:2px;display:block;"><span class="inner_menu">Om oss</span></span></a></li>

                                        <li><a href="#"><span style="padding:2px;display:block;"><span class="inner_menu">Kontakt</span></span></a></li>

                                        <li"><a href="#"><span style="padding:2px;display:block;"><span class="inner_menu">                 </span>här ska det inte synas något men denna li skall fyllas ut till höger så långt det bara går</span></a></li>

                                </ul>

Den sista li har jag tönkt skall fylla ut resten av <ul>. Men jag får det inte att funka :(

Det kan du väl lösa med hjälp av Javascript (jQuery)?
http://api.jquery.com/width/

Typ:

Kod:



ulWidth = $("ul").width();

liTotWidth = '';

$('ul li').each(function() {

    liTotWidth = (liTotWidth+$(this).width());

});



lastLiWidth = (ulWidth-liTotWidth);



$("ul li:last-child").css("width",lastLiWidth);