IE8: Table Doesn't Know To Scroll

Question

One more IE8 hangup. Advice appreciated.

So I have the following table. A Javascript function, based on user inputs, populates tbody with dozens of values. Firefox and Chrome both add a scrollbar when that happens; IE, however, does not, and the table simple goes on forever, even breaking out of its div.

How to I make IE8 recognize that an overflow has happened?

<div>
        <form>
        <table id="myTable" style="display: block; max-height: 300px;">
            <thead style="display: block; color: white; font-family: arial, helvetica, sans-serif; width: 796px; " > 
            <tr id=head> <B>
                <th style="width: 170px; text-align: center" >Location</th> 
                <th style="width: 70px; text-align: center">Year</th> 
                <th style="width: 520px; text-align: center" >Title</th>
                </B>
            </tr> 
            </thead>
            <tbody style="display: block; width: 796px; height: 280px; overflow: scroll; text-align: center;" > 
            </tbody>  
        </table>
        </form>
    </div>

score 0 · Answer 1 · answered Jan 08 '13 at 20:46

0

Have you tried creating a CSS class for the table with an overflow attribute in it?

.table {overflow: scroll;}

That should work in IE8.

answered Jan 08 '13 at 20:46

snowYetis

1,517
16
28

Sadly, nothing doing. I think the issue is related to the fact that the table is initially unpopulated. – Daniel Ezra Moraff Jan 08 '13 at 20:51

IE8: Table Doesn't Know To Scroll

1 Answers1