South panel cut off

[pacific202]

My south layout panel is getting cut off, and I don't know how to fix it!  Tested in IE7 and latest Chrome.

Here's what I have on the page in terms of height/width/fit:

easyui-panel (no fit or style)
  easyui-layout (no fit, style=width:100;height=400)
    div west (no fit, width:350px;height:300px)
      form (elements have width:200px)
    div center (no fit or style)
      datagrid (no fit, height:400px)
    div south (no fit, height:400px)
      datagrid (no fit, height:400px)


I've played around with putting fit="true" on all sorts of elements, and setting the heights of inner and outer elements to try and get this to work, but nothing seems to be able to get the south panel to grow any larger.

With that said, if I put fit="true" on the south panel then the page loads with the South panel taking up the whole panel, and I can minimize it to see the west and center panels.  Close, but not what I need.

[pacific202]

Although I'd really like to get all three displaying at page load, a valid workaround would be to set the south panel to hidden at load AND the title of the south panel to be displayed when it is hidden (right now there's just a blue bar which doesn't let the users know what is down there).

[pacific202]

Solved by moving the south panel outside the parent easyui-panel, but I'd still like to know why putting it in the south area didn't work.

easyui-panel (no fit or style)
  easyui-layout (no fit, style=width:100;height=400)
    div west (no fit, width:350px;height:300px)
      form (elements have width:200px)
    div center (no fit or style)
      datagrid (no fit, height:400px)
<br>
div (no fit, height:400px)
      datagrid (no fit, height:400px)