Как центрировать контент внутри слайдера jCarousel на каждом разрешении

Question

Я использую jCarousel для реализации горизонтальной слайд-навигации сайта. Это моя структура страницы.

<div id="content" class="main">
        <div class="jcarousel">
            <ul>
                <li id="area-1">(CONTENTE HERE)</li>
                <li id="area-2">(CONTENTE HERE)</li>
                <li id="area-3">(CONTENTE HERE)</li>
            </ul>
        </div>
</div>

У меня проблемы с горизонтальным центрированием содержимого каждой области на странице. Кажется, это работает, если ширина области совпадает с разрешением экрана, но я не могу работать с фиксированной шириной, потому что мне нужно, чтобы она была центрирована на любом разрешении. Это CSS у меня сейчас:

.jcarousel {
    position: relative;
    text-align: center;
    overflow: hidden;
    width: 100%;
    height: 100%;
}
.jcarousel ul {
    width: 20000em;
    position: relative;
    list-style: none;
    margin: 0;
    padding: 0;
}

.jcarousel li {
    float: left;
    width: 1349px;
}

Это работает, только если разрешение составляет 1366*768 пикселей.