Фиксация центрирования последней линии элементов в сетке контейнера для жидкости должна быть выровнена по левому краю, пока контейнер остается центрированным

У меня возникли проблемы с выравниванием левой строки элемента "ul" внутри контейнера с жидкостью. У меня есть контейнер, центрирующий правильно со страницей, но он заканчивает центрирование последней строки элементов, когда они не заполнены полностью. Не может показаться, что это решение.

Я использую Twitter Bootstrap в самом ядре с контейнерной жидкостью для внешнего div. И центрируя элементы списка следующим образом:

ul {
    text-align: center;
    list-style:none;
}

ul li {
    display: inline-block;
}

Я пробовал использовать text-align: выравнивать и центрировать div с полями, но он, похоже, не перемещается с изменением размера страницы. Предложения?

Вот два скриншота о том, что происходит:

Пример скрипта JS: http://jsfiddle.net/Z9uqQ/

Последняя строка должна быть выровнена слева с тем же вертикальным краем, что и 1.