Question

I have a div where content is appended periodically to it via query’s append(). As the content gets longer, it will eventually overflow the div. I want no scrollbars to appear when overflowed, but still have the content scroll up to show the new content below.

Is this possible? When I use overflow-x: hidden no scrollbar appears but the content is hidden.

Answer 1

If the size of the container is fixed, you could place the content inside an absolutely positioned wrap like so:

<div class="container">
    <div class="wrap">
        <p>bah</p>
    </div>
</div>

and css:

.container {
    y-overflow: hidden;
    position: relative;
    height: 200px;
    width: 200px;
}

.wrap {position:absolute; bottom: 0; left:0;right:0;
}

http://jsfiddle.net/sXGd9/