Why display: a table behaves differently in Firefox and in Chrome?

I am making a layout similar to this

All contained withing a 'table' (display: table) __________________ | S| HEADER | | I|---------------| | D| | | E| CONTENT | | |_______________| | |FOOTER | -------------------- 

SIDE is a table-cell , and HEADER, CONTENT, FOOTER are contained in another table-cell . CONTENT is a div whose overflow-y set to auto, and in Chrome, when the content in CONTENT exceeds the initial height, a scroll bar appears and the entire table does not change vertically, however in Firefox, the entire table expands vertically, which is not corresponds to the behavior that I expected.

My table has the property table-layout: fixed and overflow: hidden . Is there a way to prevent vertical spreadsheets in Firefox?

+3
html css firefox css-tables
source share
1 answer

indicate some height

 <td> <div style="height:200px; overflow:hidden;"> contents goes here </div> </td> 

adjust the height, it should cut extra lines from your view

0
source share

All Articles