Scrolling child element inside parent?

I have a parent element with two children. One child is a dynamic ul where admins will add and remove menu links as they please. The second child is a scrolling box with feeds inside. You can image it as a Twitter feed since that’s what it reminds me of.

The problem I’m having is that since I cannot define the height of the first child, I can’t get the second child to act right. I don’t want scrollbars on the parent, but would like to have a y scrollbar on the second child once it reaches the end of the parent’s bottom axis. So far I can get the parent to have a scroll bar and cut off the second child at the bottom access or I can get the second child to overflow completely out of the parent.


.inline-block { display: inline-block; vertical-align: top; }
.nowrap { white-space: nowrap; }
#sidebar { width: 256px; padding: 11px 10px 10px; margin: 0 20px 0 0; border: 2px solid #969696; background: #e8e8e8; height: 636px; }
#ad_list { width: 244px; border: 1px solid #969696; padding: 6px 5px 5px; margin: 20px 0 0; overflow: auto; }
.ad_link { white-space: normal; margin-bottom: 10px; border-bottom: 1px solid #969696; padding-bottom: 10px; }

Problem courtesy of: o_O

稿源:CSS3 Recipes (源链) | 关于 | 阅读提示

本站遵循[CC BY-NC-SA 4.0]。如您有版权、意见投诉等问题,请通过eMail联系我们处理。
酷辣虫 » 前端开发 » Scrolling child element inside parent?

喜欢 (0)or分享给?

专业 x 专注 x 聚合 x 分享 CC BY-NC-SA 4.0

使用声明 | 英豪名录