我不知道如何问/写这个，所以请随时更新名称或指出正确的问题/标题。
我正在设计一个跨 html5-css3 网站，并试图使其在每个（常见）浏览器上看起来都相同。
这就是我所拥有的：http://www.pojotlan.com/example1/ http://www.pojotlan.com/example1/
它可以与 Firefox 14.0.1、Chrome 21.0.1180.6 和 Safari 5.1.7 配合使用（文件：estilo.css）#contenido行高用于使其适合 Safari 和 Chrome。
这是包含的 3 个 css 文件的简短版本...
html {height:100%;}
body {height:100%;}
div#Tabla {display:table; height:100%;}
div.row.main {display:table-row-group; height:auto; min-height:100%;}
div#main {display: table-cell; position: relative; height:auto; min-height:100%;}
div#contenido {display:inline-block; position: relative;
height:100%; min-height:100%; line-height:100%;}
section {height:auto; min-height:100%;}
如果我将其位置更改为绝对位置，我会在 Chrome 21.0.1180.6 和 Safari 5.1.7、Opera 12 上得到相同的外观。
如你看到的，#contenedor在 Opera 和 IE 上不适合 100% 高度。我怎样才能解决这个问题？
我对 css 样式和东西很陌生，所以我不明白出了什么问题。
先感谢您 ：）
附注是的，也许我用 css display:table 和其他东西搞乱了一切，但这就是谷歌发送给我的地方...哈哈 xD 所以，是的，你基本上可以告诉我在没有表格的情况下重新开始。 （我已经在尝试了，但结果较少。）
我无法做到这一点，所以这就是我所做的。
CSS 文件：
body, html {border: 0px; margin: 0px; padding: 0px;
height:100%; position:relative; width:100%;}
#head
{
position:absolute;
background-color: #98a;
height: 100px;
width:100%;
top:0px;
}
#footer
{
position:absolute;
background-color: #e46;
width:100%;
height:20px;
bottom:0px;
}
#content
{
position:absolute;
background-color: #dee;
height:auto;
top:100px;
bottom:20px;
width:100%;
}
body:
<body>
<div id="head">#head</div>
<div id="footer">#footer</div>
<div id="content">#content</div>
</body>
重要的是内容是绝对的，并且是顶部/底部的。
所以，这就是全部。
谢谢你：D
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
