Opera瀏覽器的CSS問題

Question

我有一個簡單的頁面：全部顯示在網頁上的5行（4行明確定義的高度[標題，bredcrumb，商標，頁腳]，1行設置為100％[內容]）。

但是，我的CSS可以在Firefox，Chrome，Internet Explorer和Safari中完美呈現。 Opera討厭我，並添加了一個滾動條。

如何構造CSS，使其適合所有5種瀏覽器，而無需在任何瀏覽器中添加滾動條？

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;
}

Answer 1

由於沒有歌劇，所以我無法測試它，但我的猜測是您需要去除身體上的填充物和邊距

html, body{
 padding: 0;
 margin: 0;
}

Opera瀏覽器的CSS問題

問題描述

1 個解決方案

解決方案1
0 已采納 2014-10-14 01:54:10

Opera瀏覽器的CSS問題

問題描述

1 個解決方案

解決方案1 0 已采納 2014-10-14 01:54:10

解決方案1
0 已采納 2014-10-14 01:54:10