Показать сообщение отдельно
  #1 (permalink)  
Старый 22.03.2013, 19:58
Интересующийся
Отправить личное сообщение для 1Dmitry Посмотреть профиль Найти все сообщения от 1Dmitry
 
Регистрация: 22.03.2013
Сообщений: 24

Как выровнять элементы li в jquery ui tabs?
Привет всем такая проблемка, не центрируются элементы списка li внутри ul
<section class="compare">
    <article id="tabs-min" class="tabs ui-tabs ui-widget ui-widget-content ui-corner-all">
        <ul class="ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all">
            <li class="ui-state-default ui-corner-top ui-tabs-selected ui-state-active"><a href="#tabs-min-1">Lorem Ipsum</a></li>
            <li class="ui-state-default ui-corner-top"><a href="#tabs-min-2">Lorem Ipsum</a></li>
            <li class="ui-state-default ui-corner-top"><a href="#tabs-min-3">Lorem Ipsum</a></li>
        </ul>
        <div id="tabs-min-1" class="ui-tabs-panel ui-widget-content ui-corner-bottom">
            <p>and since it shown only on focus I am not able to find which class to overwrite using the chrome console.
                Has anyone done this and knew what is the class that I should overwrite?
                Edit: I suppose this is the standard behaviour and here you can see the example. I am also using Chrome.</p>
        </div>
        <div id="tabs-min-2" class="ui-tabs-panel ui-widget-content ui-corner-bottom ui-tabs-hide">
            <p>Nunc eleifend iaculis nibh, sed semper nisl feugiat nec. Duis pretium,
                felis nec ornare posuere, leo erat ullamcorper nisl, a lacinia dolor urna vel quam!</p>
        </div>
        <div id="tabs-min-3" class="ui-tabs-panel ui-widget-content ui-corner-bottom ui-tabs-hide">
            <p>Pellentesque ac elit et nulla posuere convallis quis ut dolor. Pellentesque egestas
                pellentesque blandit. Morbi quis sapien nec lacus consectetur vestibulum.</p>
        </div>
    </article>
</section>

Код:
.compare{
    background: url("/images/bg-page.jpg") repeat;
    height: 300px;
}
#tabs-min {
    width: 960px;
    margin: 0 auto;
    background: transparent;
    border: none;
}
#tabs-min .ui-widget-header {
    background: transparent;
    border: none;
    border-bottom: 1px solid #686868;
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
    border-radius: 0px;
}
#tabs-min .ui-tabs-nav .ui-state-default {
    background: transparent;
    border: none;
}
#tabs-min .ui-tabs-nav .ui-state-active {
    background: transparent url("/images/uiTabsArrow.png") no-repeat bottom center;
    border: none;
}
#tabs-min .ui-tabs-nav .ui-state-default a {
    outline-color: transparent;
    color: #686868;
}
#tabs-min .ui-tabs-nav .ui-state-active a {
    color: #459e00;
}
Как сделать чтобы каждый li был 300px и margin между ними 10px
Ответить с цитированием