"position:absolute" inside ScrollableView can screw up scroll calculation

[Ming Zhe Huang]

Please see the video. Test case is also attached.
This test case derives from a much more complex scenario in which "position:absolute" is used for layout. However, if "position:absolute" is used, you cannot scroll to the bottom of the view.

[Ming Zhe Huang]

Test Case

[Ming Zhe Huang]

video

[Atsushi Ono]

It is the standard HTML behaviour that the size of absolute positioned child block is ignored to compute the size of parent container. In this case the computed height of ScrollableView's containerNode is 0px, so you cannot scroll to the bottom of the list. This works as expected.

To avoid this, please try the followings:

• Reconsider whether position:relative can be used instead
• Set the height of ScrollableView's containerNode explicitly as below

dijit.byId("parentScrollableViewId").containerNode.style.height = "500px";

[ykami]

Archer, it is obvious from the CSS spec that a container element does not expand if its children are all absolute. In addition to onoat's suggestions, another possible idea I think is to have a place holder relative div element with an explicit height specified. That way you don't have to care about the ScrollableView's internal containerNode.

[Ming Zhe Huang]

Thanks. I totally agree that this bug is invalid.

A suggestion. This bug may remind us that we need more layout strategy or layout containers, then people are less likely to take care of details of layout by themselves, which sometimes is cumbersome or rigid.
Actually in my scenario the problem can be solved if we have a expanding box which eats remaining space not occupied by siblings, something like CSS3 flex box tries to provide.