Сделать ul увеличивать ширину согласно содержимому

У меня есть меню суперфишей, реализованное в этом сайте

Если вы наводите курсор на меню продукта, выпадающее меню будет точно соответствовать ширине основного родительского меню, даже если содержимое больше. Как сделать меню более широким в соответствии с содержимым в нем. Теперь содержимое просто переполняется.

Ответ 1

Добавьте следующие стили в свой grid.css или в любой другой .css файл/заголовок после grid.css:

.sf-menu ul{
    min-width:100%; /* at least the size of the header */
    width:auto; /* size the block automatically */
}
.sf-menu ul li{
    white-space:nowrap; /* prevent word wrap */
}

Обратите внимание, что это не будет иметь одинаковых результатов в IE7, однако ваш веб-сайт не будет представлен в IE7. Работает в IE8, IE9 и Firefox 10 (должен работать во всех браузерах, совместимых с CSS2).