EasyUI Forum

General Category => General Discussion => Topic started by: baxter on July 17, 2012, 10:49:11 AM



Title: Tabs not fit correctly
Post by: baxter on July 17, 2012, 10:49:11 AM
Hey,

i have a little problem with a tab in a Panel... hope anyone can help;-=

I load a content per js function:
Code:

$(function () {
       $('#systabs').tabs({
  border: 0
});
   
//addTab('/window.php', 'Übersicht', 'icon-main');
inittab();
   });

   function getContent(url) {
        
return $.ajax({
            type: "GET",
            url: url,
            cache: false,
            async: false
}).responseText
   }

   function addTab(url, title, icon) {
        
document.getElementById("domaininfo").style.display = 'hidden';

if(url.match(/switch=1/) && url.match(/neworder/)){
   $('span#text').hide();
   $('span#textarea').show();
   $('#domain_available').html('');
   $('#check').hide();
   $('#domain').val('');
}
    
       if ($('#systabs').tabs('exists', title)) {
            $('#systabs').tabs('select', title)
            } else {
            index++;
        
            $('#systabs').tabs('add', {
title: title,
content: getContent("/window.php" + url),
iconCls: icon,
closable: true,
border: 0,
tools: [{
   iconCls: 'icon-mini-refresh',
   handler: function () {
updatecontent(icon);
   }
}],
   })
}
   }

   function inittab() {
    
index++;

$('#systabs').tabs('add', {
   title: "Übersicht",
   content: getContent("/window.php"),
   closable: false,
   iconCls: 'icon-main',
   fit: true,
   border: 0,
   tools: [{
iconCls: 'icon-mini-refresh',
handler: function () {
   update()
}
   }],
})
...

When i open the page, is the first Tab "inittab()" not centered. All other Tabs (after open) is correct working. If i use the "fit: true", is the first tab fine but i have the scrollbars in all Tabs...?

Without Fit:
(http://img827.imageshack.us/img827/5010/withoutfit.png)

With Fit:
(http://img444.imageshack.us/img444/7379/withfit.png)


Title: Re: Tabs not fit correctly
Post by: stworthy on July 17, 2012, 08:08:29 PM
Do you place the tabs in your center panel of layout? If so, apply the style(overflow:hidden) to the center panel. If the issue continue, please provide some html code to demonstrate how to layout your tabs component.


Title: Re: Tabs not fit correctly
Post by: baxter on July 18, 2012, 11:01:22 AM
Thanks, That works;-)