Geek asks and answers

Jquery widget css overrides my own CSS

I use jquery tabs and several other jquery widgets.

Now inside the tab, all content is designed in accordance with CSS jquery. So the easiest way is to simply comment on or modify a few jQuery CSS definitions. But then, obviously, all other widgets, such as autocomplete, no longer work.

How do other people solve this problem? My preferred solution would be if I could leave the CSS jquery as it is, and I just have my own default CSS in tabs.

Example:

.ui-widget-content { border: 1px solid #aaaaaa; background: #ffffff url(images/ui-bg_flat_75_ffffff_40x100.png) 50% 50% repeat-x; color: #222222; }

This overrides the color of the text on my tab. This is normal for other widgets, but it looks bad inside the tab.

+3
source share
2 answers

, CSS jquery, buttom:

<script>
    $(function() {
        $( "#tabs" ).tabs();
        $( ".tabs-bottom .ui-tabs-nav, .tabs-bottom .ui-tabs-nav > *" )
            .removeClass( "ui-corner-all ui-corner-top" )
            .addClass( "ui-corner-bottom" );
    });
</script>
0

CSS ( , , ) , jQuery.

+1

More articles:


All Articles