|
Title: full page layout using "fit:true" switch - bottom margin problem [resolved] Post by: andyj on July 25, 2013, 04:11:48 AM I am using the layout component that I want to automatically fit to the full size of the page.
This works fine as follows: Code: <body> <div class="easyui-layout" data-options="fit:true"> But if I want a small margin around the layout there is a problem with the bottom margin (padding) Code: <body style="padding:10px"> I correctly have 10px of padding top, left and right but at the bottom the layout continues 10px below the bottom of the screen.<div class="easyui-layout" data-options="fit:true"> Any suggestions on how to resolve? Title: Re: full page layout using "fit:true" switch - bottom margin problem Post by: stworthy on July 25, 2013, 07:59:17 AM One solution to solve this issue is to define the 'box' css and apply it to <body>.
Code: <style> .box{ -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; -o-box-sizing:border-box; box-sizing:border-box; } </style> <body class="box" style="padding:10px;"> <div class="easyui-layout" fit="true"> </div> </body> Title: Re: full page layout using "fit:true" switch - bottom margin problem Post by: andyj on July 25, 2013, 08:08:43 AM Spot on.
Works like a dream. Thank you again. ;D |