set all nested li's to be width of widest li

Question

How do I make nested li\'s the same width?

When I use the below code each nested li is only as wide as it\'s text + margin.

I\'d like all of the li\'s to be

Answer 1

A simple jQuery solution worked for me:

$(document).ready(function(){
    $('.sub-menu').each(function(){
        $(this).width(2000);
        var width = 0;
        $(this).children('li').each(function(){
            if ($(this).children('a').width() > width)
                width = $(this).children('a').width();
        });
        $(this).width(width);
    });
});