Question

I’m trying to make each li item exactly the same width. For example if there’s a long text ul make the rest of ul s the same size OR have a limited width size so the longest ul can brake into two lines.

See the left column menu in yellow. This is what I have:

And this is what I aim:

CSS

#menu-esde li a {
    background-color: #FFC477;
    border: 1px solid white;
    color: #FFFFFF;
    float: right;
    font-size: 20px !important;
}
#secondnav li a, #menu-esde li a {
    background-color: #FFC477;
    border: 1px solid white;
    color: #FFFFFF;
    float: right;
    font-size: 20px !important;
}
#secondnav li a {
    border: medium none;
    display: block;
    padding: 3px 8px;

Website:
http://npmaudiovisual.com/esde/?page_id=36

Answer 1

Just update your CSS with my css :-

#secondnav li a, #menu-esde li a {
    background-color: #FFC477;
    border: 1px solid white;
    color: #FFFFFF;
    float: right;
    font-size: 20px !important;
    text-align: left;
    width: 205px;
}

see the attached image result is as per your requirement :-