html - CSS issue with Opera browser -
html - CSS issue with Opera browser -
i have simple page: 5 rows (4 rows explicitly defined height [header, bredcrumb, trademark, footer], 1 row set 100% [content]) display on web page.
however, css renders in firefox, chrome, net explorer , safari. opera hates me , adds scrollbar.
how construction css fits 5 browsers, without adding scrollbar browser?
html:
<html> <head> </head> <body> <div class='header'> </div> <div class='breadcrumb'> </div> <div class='content'> <div class='panels'> <div class='panel-a'> </div> <div class='panel-b'> </div> <div class='panel-c'> </div> </div> </div> <div class='trademark'> </div> <div class='footer'> </div> </body> </html>
css:
div.header, div.breadcrumb, div.content, div.trademark, div.footer { display: table-row; width: 100.00%; } div.header { height: 2em; } div.breadcrumb { height: 1.5em; } div.content { height: 100%; } div.panels { display: table-cell; height: 100%; width: 100%; } div.panel-table { display: table; height: 100%; width: 100%; } div.panel-a, div.panel-b, div.panel-c { display: table-cell; } div.trademark { height: 1.25em; } div.footer { height: 2em; }
i cannot test due not having opera guess need remove padding , margins body
html, body{ padding: 0; margin: 0; }
html css table opera
Comments
Post a Comment