No matter how tall I make it, the scroll bar just won't stop showing

Question

Check out this fiddle for more information: http://jsfiddle.net/LAueQ/

Even after increasing the height of the campaignDiv div, the scrollbar keeps showing up.

If possible, I would like to avoid using overflow: hidden.

Answer 1

Answer №1

The reason for the issue is due to the usage of overflow: auto; on the ul element, which does not match the height of #campaignDiv

To resolve this, you can adjust the ul to occupy the full height of its parent by including:

#campaignDiv ul {
    height: 100%;
}

Answer 2

The reason for the issue is due to the usage of overflow: auto; on the ul element, which does not match the height of #campaignDiv

To resolve this, you can adjust the ul to occupy the full height of its parent by including:

#campaignDiv ul {
    height: 100%;
}

Answer 3

Even when I increase the height, the scrollbar remains visible.

In my experience, if you set a greater height, the scrollbar actually disappears.

#campaignDiv ul {
    color: #fff;
    list-style: none;
    overflow: auto;
    padding-left:5px;
    height:500px;
}

If you remove overflow: auto; on the ul, it will also hide the scrollbar...

Answer 4

Even when I increase the height, the scrollbar remains visible.

In my experience, if you set a greater height, the scrollbar actually disappears.

#campaignDiv ul {
    color: #fff;
    list-style: none;
    overflow: auto;
    padding-left:5px;
    height:500px;
}

If you remove overflow: auto; on the ul, it will also hide the scrollbar...

Answer 5

Insert the scrolling="no" attribute

Answer 6

Insert the scrolling="no" attribute