I have a you grid component on your tabbar component and would like to change the default position of the GRID on the a tab. I have tried the following using CSS:
#mygrid_container {
position:relative;
top: 20%;
}
The #mygrid_cointainer is the DIV that is placed inside the tab control. If is use left 20% that works and the grid is moved to the left, but the “top” css command has no affect. I have also tried to do ABSOLUTE position and it has no affect.
I am attaching the entire JS code below that I use to initialize the project.
Thanks
==================PROJECT CODE======================================
Test
var mygrid;
var tabbar;
function myInit(){
doInitGrid();
initTabbar();
}
function doInitGrid(){
mygrid = new dhtmlXGridObject(‘mygrid_container’);
mygrid.setImagePath(“codebase/imgs/”);
mygrid.setHeader(“Model,Qty,Price”);
mygrid.setInitWidths("*,150,150");
mygrid.setColAlign(“left,right,right”);
mygrid.setSkin(“light”);
//allows for client side sorting
mygrid.setColSorting(“str,int,int”);
//set up column types
mygrid.setColTypes(“ed,ed,price”);
mygrid.init();
mygrid.loadXML(“widget.htm”);
var dp = new dataProcessor(“widget.htm”);
dp.setTransactionMode(“POST”);
//dp.enableDebug(true);
dp.init(mygrid);
}
function initTabbar(){
tabbar=new dhtmlXTabBar(“a_tabbar”,“top”);
tabbar.setImagePath(“codebase/imgs/”);
tabbar.setSkinColors("#FCFBFC","#F4F3EE");
tabbar.addTab(“a1”,“Search”,“100px”);
tabbar.addTab(“a2”,“Add/Edit”,“100px”);
tabbar.setContent(“a1”,“mygrid_container”);
//tabbar.setContent(“a2”,“html_2”);
tabbar.setTabActive(“a1”);
tabbar.enableAutoSize(true,true);
//tabbar.enableAutoReSize(true);
}