Hi,
I want to use a border layout that uses 100% width and 100% height of the window. As stated in the documentation of the reflow method, one should use percent sizes. So I grabbed your sample code and replaced the pixel height (300px) by percent height (100%).
With this settings the border layout does not work at all. The footer is not displayed at the bottom. I have to scroll to the footer. What am I doing wrong? I have added the code as an attachment. I am using IE10.
I additionally tried to set width/height in the options, but with no result.
Thanks in advance for your help.
Michael
Hi Michael,
Thank you for posting on our forums.
Please note that whenever you utilize a percent width or height for an element, the size will be relative to the element's parent. To ensure the div element consumes 100% of the width and height of the visible area of the browser, please use the following CSS snippet: <style type="text/css"> html, body { height: 100%; margin: 0px; }</style>
Also, please provide me with more details about what you did to set the width/height in the options. Are you referring to the igLayoutManager's options? If so, please not that the igLayoutManager doesn't have a setter option for height and width. To learn more about these options, please review the API docs linked below:ui.igLayoutManager height only has a getter:http://help.infragistics.com/jQuery/2014.1/ui.iglayoutmanager#options:height ui.igLayoutmanager width only has a getter:http://help.infragistics.com/jQuery/2014.1/ui.iglayoutmanager#options:width Please let me know if you have any questions regarding this matter.
Hi Jose,
thanks for the reply. But it still seems not to work. I have attached an example. I have added the html,body { } styles as you have suggested, but the resize still not work properly.
Kind Regards
Thank you for the update.
The sample in your previous post doesn't show with a height of 100% because the height of the layoutManager isn't set to 100%. The initialization logic for the layoutManager should like like:
$('#layout').igLayoutManager({ layoutMode: "flow", //you have to set the height of the layout manager height: "100%", items: [ { width: "100%", height: "100%" } ] }); });
Also, I have attached my modified version of the two sample's you've attached to this thread.
Please let me know if you have any questions regarding this matter.