User Experience Stack Exchange is a question and answer site for user experience researchers and experts. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

Is it a bad idea to have a scrollable element within a scrollable element? I sometimes feel it tricky because, when I scroll with the mouse or keys, the element that I didn't intend sometimes scrolls.

If it is a bad idea, it there an alternative way to deal with in such cases?

share|improve this question
If you see issues with the interaction yourself, without any user testing, it really is a bad interaction. – dnbrv Mar 28 '12 at 23:21
@dnbrv My experience is with things that are out there, not that I made it. – sawa Mar 29 '12 at 1:05
If you, as a user, and you see something that doesn't feel right, it must be not right. Workflows might not suit everyone because they are tied to mental models but convoluted interactions are bad universally. – dnbrv Mar 29 '12 at 2:14
Can you give an actual example, how does this look like? – firedrawndagger Mar 29 '12 at 2:51
up vote 4 down vote accepted

A scrollable element within another scrollable element doesn't automatically disqualify a design. The textbox in which I'm typing this is a scrollable element within the scrollable question page on UX.SE, and that's fine. The Facebook ticker (top right) is a scrollable component within the scrollable FB page. Most widget-based webpages display this behavior as well, unless they've turned it into a webapp, like Gmail - where each area is scrollable but the page itself isn't.

But it needs to be carefully designed. It should employ on-demand scroll bars, which help the user know which element is currently attached to the mouse wheel / arrows, and the detailed interaction should be well thought through.

The one case where it's especially difficult is designing for touch screen. Since there is no hover on touch screens, you can't implement on-demand scroll bars, and if you open such a page on an iPad and swipe within the internal element, it won't know which of the elements you meant to scroll.

share|improve this answer

This sounds like an obvious bug to me, my hunch is that it's a browser issue. But yes scrollable elements are a big no-no. It's hard to answer this without an example but there are several ways you could overcome this, e.g. expanding the window area of one element or the other, possibly separating the two elements out. Again, an example would help here.

share|improve this answer

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.