gpt4 book ai didi

css - 在 IE 兼容模式下 form 脱离 div

转载 作者:太空宇宙 更新时间:2023-11-04 15:24:12 26 4
gpt4 key购买 nike

我在 div 中有一个(带边框)。这在 Firefox 和 IE 10 上看起来不错(不确定旧版本的 IE)。但是,有时 IE 会激活兼容模式,然后表单(输入框和提交按钮)会脱离 div。是否有一些 css 调整来防止这种情况?

我的 HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<title>test</title>
</head>

<body>
<div class="box">
<h2 style="display:inline;">Some sample text</h2>

<form id="frm">
<input type="text" id="tb" />
<input type="submit" class="button" />
</form>
</div>
</body>
</html>

和我的CSS

.box {
display:block;
height:40px;
magin-left:5px;
padding:5px 0 0 10px;
width:740px;
background:green;
border:1px solid black;
}
h2 {
margin:0 0 7px;
padding:0;
font:1.6em Arial;
letter-spacing: -1px
}
#tb {
width:225px
}
.button {
float:right;
width:93px;
margin-left:5px;
padding:2px 0
}
form {
float:right;
}
#frm {
margin-right:10px;
margin-top:2px;
width:330px;
}

jsfiddle 上的实例: http://jsfiddle.net/d3EdW/1/

截图: screenshot

最佳答案

由于您的表单是 float 的,请尝试通过将 overflow: auto; 放在表单的父级上来清除它,例如 .box

关于css - 在 IE 兼容模式下 form 脱离 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14223297/

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