Start Building Professional
Web Apps Today


 
Categories Question details Back To List
Question  posted by Sandaly KEITA on Sep 17, 2009 11:55
open dhtmlx forum
IE pb with DIV height

Hi,

With IE 8, I have a pb with the height of the DIV which contains my grid.

I defined my DIV as

<div id="gridboxI" width="100%" style="background-color:white;overflow:hidden;position:relative;"></div>

and here is the result with Firefox:

<div id="gridboxI" class="gridbox" style="overflow: hidden; background-color: white; position: relative; width: 100%; height: 67px; cursor: default;" width="100%"></div>

and here is the result with IE:

<div id="gridboxI" class="gridbox" style="overflow: hidden; background-color: white; position: relative; width: 100%; height: 200px; cursor: default;" width="100%"></div>

So I have a large space after my grid and the following

Thank you
Answer posted by dhxSupport on Sep 18, 2009 01:34
To fix this issue you need to add necessary height to the grid container:
<div id="gridboxI" width="100%" height="67px" style="background-color:white;overflow:hidden;position:relative;"></div>
Also you can use auto height mode. In such mode grid container will increase/decrease it's height depending on the number of rows in grid:
mygrid.enableAutoHeight(true)
http://dhtmlx.com/dhxdocs/doku.php?id=dhtmlxgrid:api_method_dhtmlxgridobject_enableautoheight
Answer posted by Sandaly KEITA on Sep 18, 2009 06:59

I already used enableAutoHeigth(true) and for my grid mygrid it's correct but for my grid mygridI there's a blank and I think an error in the calcul of the height of the grid with IE8.

My version is 70223.

mygridI = new dhtmlXGridObject('gridboxI');

mygridI.entBox.onselectstart = function(){ return true; };

mygridI.setImagePath("imgs/");

mygridI.setHeader("<?= affiche_langue($LIBrapport_intervention_evenement,1) ?>");

mygridI.setInitWidths("645");

mygridI.setColAlign("left");

mygridI.setColTypes("rotxt");

mygridI.setColSorting("str");

mygridI.setStyle("background: url(../image/corner_th.jpg) no-repeat #7A95B4;color:#FFFFFF;padding: 4px 2px;font-size: 11px;font-weight: bold;border-left: 1px solid #5B7297;border-right: 1px solid #A5C4DA;","border: 0px;padding: 4px 2px;font-size: 10px;")

mygridI.setOnRowSelectHandler(OnClickedRowI,true);

mygridI.setOnLoadingEnd(OnLoadingI);

mygridI.setOnRightClick(OnRightClick)

mygridI.enableAutoHeigth(true);

mygridI.enableMultiline(true);

mygridI.init();

mygridI.enableAlterCss("even","uneven");

mygridI.loadXML("xml/getListeIncident.php");

mygrid = new dhtmlXGridObject('gridbox');

mygrid.entBox.onselectstart = function(){ return true; };

mygrid.setImagePath("imgs/");

mygrid.setHeader("<?= affiche_langue($LIBfaitRAA,1) ?>,<?= affiche_langue($LIBfaitDATE_HEURE,1) ?>,<?= affiche_langue($LIBfait_info,1) ?>,<?= affiche_langue($LIBfaitVALIDE,1) ?>,,<?= affiche_langue($LIBfaitDIFFUSION,1) ?>,,");

mygrid.setInitWidths("30,100,385,65,0,65,0,0");

mygrid.setColAlign("center,center,left,center,center,center,left,left");

mygrid.setColTypes("img,rotxt,rotxt,ch,rotxt,ch,rotxt,rotxt");

mygrid.setColSorting("str,str,str,str,str,str,str,str");

mygrid.setStyle("background: url(../image/corner_th.jpg) no-repeat #7A95B4;color:#FFFFFF;padding: 4px 2px;font-size: 11px;font-weight: bold;border-left: 1px solid #5B7297;border-right: 1px solid #A5C4DA;","border: 0px;padding: 4px 2px;font-size: 10px;")

mygrid.setOnRowDblClickedHandler(OnDblClickedRow);

mygrid.setOnRowSelectHandler(OnClickedRow,true);

mygrid.setOnCheckHandler(OnCheckHandler);

mygrid.setOnLoadingEnd(OnLoading);

mygrid.setOnRightClick(OnRightClick)

mygrid.enableAutoHeigth(true);

mygrid.enableMultiline(true);

mygrid.init();

mygrid.setColumnHidden(4,true);

mygrid.setColumnHidden(6,true);

mygrid.setColumnHidden(7,true);

mygrid.enableAlterCss("even","uneven");

mygrid.loadXML("xml/getListeFait.php?id_cas=<?= $_SESSION['CAS'] ?>");