Question

Last week I asked the following question to which I got an answer:

jqPlot – Pie legend too tall when there are many legend items

I’m now looking for a way to add a vertical scrollbar to my legend box which in some cases could contain more than 20 legend items.

I can achieve the result I want in FireFox and Chrome if I add the following settings to my CSS file:

table.jqplot-table-legend {
    display: block;
    height: 350px;
    overflow-y: scroll;
}

however I need to achieve the same effect in IE9.

Does anybody know what CSS settings I need?

Answer 1

I found some people on the web mentioned some issues with overflow on tables in IE, but I couldn’t get a needed answer.

Therefore, my approach was to wrap the table into another element. I wrap it in a div and set appropriate values on it and it works cross browser 🙂

To see the legend wrapped in a div you must click Tab 3 then click Where is my plot? button, as the wrapping happens on click of the button.

If someone has a better solution please do let us know.

One of the sites I was referring to. Here you have a nice table and it works fine also in IE8, but not in IE7 and IE9?

Yet another reason why people should switch to other browsers.

The code is here.