Positioning and Layout

2 posts, 0 answers
  1. Rakesh
    Rakesh avatar
    3 posts
    Member since:
    Jul 2013

    Posted 23 Nov 2015 Link to this post

    I am new to html5 world. Need some help in layouts (css).

    I created a sample in plunker. http://plnkr.co/edit/nXxN17?p=preview

    Basically, i am looking for main body non-scrollable. All content should be with in main page and making center element scrollable(in this case listview).


    this is my requirement.

    div - 40px;
    div - maxHeight: 100px; - header
    div(pager) - 30px;
    div(listview) - * fill height and scrollable
    div -
    div - maxHeight: 100px; - footer
    div - height - 40px; - buttons always stays on bottom


    Appreciate your help

    - Thanks


  2. Dimo
    Dimo avatar
    8404 posts

    Posted 25 Nov 2015 Link to this post

    Hi Rakesh,

    The described scenario requires the ListView element (div#listView) to have a height style and an overflow:auto style. The height can be calculated with Javascript, depending on the height of the browser viewport and the other elements on the page.

    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top