How should one give lists height? (A list scrolling issue)

I am having trouble getting a list (whose contents overflow its div) to scroll correctly.

This fiddle demonstrates the problem:

Messing around with it suggests that the problem is that the list doesn't have a height. Setting an explicit height in the style field makes the list scroll as expected. However, I want the list to fill the entire drawer that contains it, so the height may change. What is the proper way to get this list scrolling correctly. Any help would be greatly appreciated, thanks.


  • There are quite a few ways.
    A scroller requires a specific height to be set.
    you can use the Fittables to have dynamic heights.
    You can also call .getBounds() on the parent container to get its height, and then apply that height to the list.
    You can make use of the resizeHandler function to react to page size changes, and adjust your list height accordingly.

    There are probably more ways too, but those are the ways i generally use.
  • Giving the list's parent a layoutKind: enyo.FittableRowsLayout and giving the list fit: true had no effect. Any idea why not?
  • so, in that situation, it means that the height decision is pushed out the parent that hosts the FittableRowsLayout. Does the parent have a definite height?
Sign In or Register to comment.