can you help me to fix this layout: https://i.stack.imgur.com/mHdlW.jpg
I'd like the grid will fill totally (hoizontally and vertically) its parent div without show me the outermost scrolbar(the window scollbar) The only scrollbar that i'd like to see are the those of the grid
the page has a kendoSplitter in the middle
this is my markup
<body>
<img src="images/logo.png" />
<h1>Archivio documentale</h1>
<div id="horizontal" style="height: 100%; width: 100%">
<div id="left-pane">
<div class="pane-content" style="width:390px;">
<!-- LEFT SIDE CONTENT initial fixed width -->
</div>
</div>
<div id="main-pane">
<div class="pane-content">
<div id="mainGrid"></div>
</div>
</div>
</div>
</body>
You could use
Viewports
. There isvh
(View Height) andvw
(View Width).vh
takes the height of the window dinamically, andvw
takes the width of the window also dinamically.Therefore, by applying the following:
Your grid would always fit 100% no matter what.
Example: http://codepen.io/diego-fortes/pen/oYKpqK
I hope it helps :)