Horizontal scroll for listbox

Question

I am having an html listbox with a lengthy content. The width of the content is also too long that horizontal scroll bar is a necessity. Unfortunately horizontal scroll bar is not there in listbox. How can get both horizontal and vertical scroll for the listbox. I have given a div as a parent to this html listbox and gave overflow-x: auto for it and given full width for the listbox inside it.

i.e, .listbox{width:560px;height:560px} .div{ height:500px;width:200px}

But when I gave like this i got the horizontal scroll bar for the div which when scrolled shows the whole content.But the vertical scroll of the listbox will be shown only when we move the scroll of the div to the extreme right end

Can any one please help me to solve this problem?

Answer 1

You have to delegate both the horizontal and vertical scrollbars to the enclosing div:

.listbox {
    width: 560px;
    height: 560px;
    overflow: visible;
}

.div {
    width: 200px;
    height: 500px;
    overflow: auto;
}