Question

Yii jquery ui tabs default styles:

<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"><a title="#yw0_tab_0" href="#yw0_tab_0">test</a></li>
<li class="ui-state-default ui-corner-top ui-tabs-selected ui-state-active"><a title="#yw0_tab_1" href="#yw0_tab_1">test title</a></li>
<li class="ui-state-default ui-corner-top"><a title="#yw0_tab_2" href="#yw0_tab_2">test content</a></li>
</ul>

Now, I want to modify

<ul class="ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all">

to

<ul class="ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-corner-top">

How can I do it in Yii framework? Please answer in details, thanks.

Answer 1

This is not really a Yii issue but more to do with how jQuery ui styles the tabs when it loads in its javascript.

You can always fix this with some jQuery

$(function(){
    $('.ui-tabs-nav').removeClass('ui-corner-all ui-widget-header').addClass('ui-corner-top')
});