gpt4 book ai didi

html - 显示 :table & display:table-cell not working in IE9

转载 作者:行者123 更新时间:2023-11-28 04:06:33 25 4
gpt4 key购买 nike

Salam(意思是你好):)

我正在尝试使用 display:tabledisplay:table-cell 为我的网页实现 3 列布局。它在 firefox 和 chrome 中运行良好,我知道 this feature should be supported in IE 9 ,但到目前为止我所取得的成就不过是这张截图:

enter image description here

我怎样才能让它在 IE 8+ 中工作?

这是我的完整代码:

( JS Fiddle 可用)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN">
<html>
<head>
<title>test</title>
<meta http-equiv="Content-Type" Content="text/html;charset=UTF-8">
<style type="text/css">
*{
margin: 0;
padding: 0;
}
html,body{
width:100%;
margin:0;
padding:0;
}
.container{
display:table;
width:100%;
border-collapse:separate;
}
.col{
display:table-cell;
}
.side-1{
width:200px;
background: #efefef;
}
.side-2{
width:200px;
background: #f8f8f8;
}
.content{

}
#header,#footer{
height:40px;
background: #e4f3fd;
}
</style>
</head>
<body>
<div id="header">header</div>
<div class="container">
<div class="col side-1">
sidebar 1
<br>.<br>.<br>.
</div>
<div class="col side-2">
sidebar 2
<br>.<br>.<br>.
</div>
<div class="col content">
content
<br>.<br>.<br>.
</div>
</div>
<div id="footer">footer</div>
</body>
</html>

最佳答案

问题是 IE 无法呈现最新版本的页面,adding a X-UA-Compatible meta tag让我们选择应该呈现页面的 IE 版本,将其设置为最新(边缘)版本可以解决问题:

<meta http-equiv="X-UA-Compatible" content="IE=edge">

关于html - 显示 :table & display:table-cell not working in IE9,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21803840/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com