Stange tabs

[epotvin]

I'm using gxt 3.0-rc.

Here is a window source I'm currently coding :

package com.kogitec.admin.settings;


import com.sencha.gxt.core.client.util.Margins;
import com.sencha.gxt.widget.core.client.ContentPanel;
import com.sencha.gxt.widget.core.client.TabPanel;
import com.sencha.gxt.widget.core.client.Window;
import com.sencha.gxt.widget.core.client.button.TextButton;
import com.sencha.gxt.widget.core.client.container.BorderLayoutContainer;
import com.sencha.gxt.widget.core.client.container.BorderLayoutContainer.BorderLayoutData;


public class SettingsWindow extends Window {


    public SettingsWindow() {
        setHeadingText("Settings");
        setPixelSize(600, 400);
        
        BorderLayoutContainer container = new BorderLayoutContainer();
        
        ContentPanel categoryTree = new ContentPanel();
        
        BorderLayoutData westData = new BorderLayoutData(200);
        westData.setCollapsible(true);
        westData.setMargins(new Margins(0));
        container.setWestWidget(categoryTree, westData);
                
        TabPanel tabPanel = new TabPanel();
        BorderLayoutData centerData = new BorderLayoutData();
        centerData.setMargins(new Margins(0));
        
        container.setCenterWidget(tabPanel, centerData);
        
        add(container);
        
        BorderLayoutContainer blContainer = new BorderLayoutContainer();
        blContainer.setCenterWidget(new TextButton("asdf"));
        tabPanel.add(blContainer, "Users");
        tabPanel.add(new BorderLayoutContainer(), "Other");


    }
}

Which appears like this :

settings.png

Do someone know why there is a space before the first tab and why the blue bar beside the tabs are thicker than usual?

Emmanuel

[Colin Alworth]

I can't reproduce the issue with just your code sample. The closest I can get is with a bullet point to the left of each tab, as a result of not listing the reset.css file in the html page.

This is typically loaded via a line like this:

<link rel="stylesheet" type="text/css" href="modulename/reset.css" />

where `modulename` is replaced by the name of your module - this file lives in the same directory as your compiled files, and is copied into the file during compilation, and when starting up dev mode.

Edit: I do see this in chrome, but in FF the bullets are still visible. This confirms the issue, make sure the reset.css is present on your page and is loading correctly.

[epotvin]

Yeah! I don't know what this css file is, but it worked! Thanks!

Emmanuel