Full width tabs using Bootstrap (Support IE)

Question

I\'m trying to adjust Bootstrap tabs to make them span the full width of their container. Here\'s my code (a minimal working example):

<         


        

Answer 1

Try this, for all '.nav-pills' and each 'li' element inside with double loop.

function(){
$('.nav.nav-tabs').each(function(){
    var liGroup = $(this).children('li');
    var liLength= liGroup.length;
    liGroup.each(function(){
        var liWidth = 100/liLength-1;
        $(this).css({'min-width': liWidth+'%','margin-left':'0px','margin-right':'0px'});
    });
});}

DEMO http://jsfiddle.net/