EasyUI Forum
March 28, 2024, 11:43:49 PM *
Welcome, Guest. Please login or register.

Login with username, password and session length
News:
 
   Home   Help Search Login Register  
Pages: [1]
  Print  
Author Topic: Panel - fit to bottom of page?  (Read 14830 times)
pacific202
Newbie
*
Posts: 35


View Profile
« on: October 11, 2011, 03:39:45 PM »

The attached page was created using the following code:

Code:
    <body>
        <div id="batch-panel" class="easyui-panel" fit="true" style="padding:10px;background:#FFFFFF;">
        Some content
        </div>
    </body>

Why doesn't the fit="true" parameter expand the white panel all the way to the bottom of the page?
Logged
stworthy
Administrator
Hero Member
*****
Posts: 3581


View Profile Email
« Reply #1 on: October 11, 2011, 05:46:00 PM »

Set the 'fit' property to true will make the panel fit its parent container size. Normally you need to set the size for your parent container:
Code:
<html style="height:100%;overflow:hidden;">
<body style="height:100%;overflow:hidden;padding:0;margin:0">
<div id="batch-panel" class="easyui-panel" fit="true" style="padding:10px;background:#FFFFFF;">
Some content
</div>
</body>
</html>
Logged
pacific202
Newbie
*
Posts: 35


View Profile
« Reply #2 on: November 04, 2011, 08:03:12 AM »

I've tried this a few different ways and it still doesn't work.  Are there any other ways to get this to work with fit/% and not specifying an absolute pixel height?
Logged
pacific202
Newbie
*
Posts: 35


View Profile
« Reply #3 on: November 08, 2011, 10:08:41 AM »

I finally solved this using the advice in this post:

http://stackoverflow.com/questions/1192783/css-how-to-set-div-height-100-minus-npx


Code:
    <div id="main-panel" class="easyui-panel" style="position:absolute;top:50px;bottom:10px;padding:10px;background:#FFFFFF;">
        Content in div
    </div>

(note: I have a header div that is 40px high and 10px of padding at the top)
Logged
Pages: [1]
  Print  
 
Jump to:  

Powered by MySQL Powered by PHP Powered by SMF 1.1.18 | SMF © 2013, Simple Machines Valid XHTML 1.0! Valid CSS!