gpt4 book ai didi

css - IE7 中奇怪的 float 和填充

转载 作者:行者123 更新时间:2023-11-28 18:57:12 25 4
gpt4 key购买 nike

我有这个简化的代码:

<div class="container">
<input type="submit" name="submit" class="submit" value="Sign Up">
</div>

以及它的 CSS:

input.submit{
padding-left: 40px;
padding-right: 40px;
float:right;
}
.container{
background-color: #AAA;
float:right;
padding: 50px;
}

我希望 div 环绕输入按钮,向右浮动,其大小等于按钮的大小 + 内边距 (50px)。在其他浏览器中它运行完美,但在 IE7 中发生了 2 件奇怪的事情:

  1. div 的宽度延伸到整个网页。如果我从 input.submit 的 CSS 中删除 float:right,则 div 的大小是正确的。
  2. 输入按钮的宽度也比按钮在其他浏览器中显示时大得多。

这是我使用的文档类型:

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

有人知道为什么会出现这些问题以及如何解决吗?

最佳答案

我不明白为什么在 input.submit 上需要 float: right,所以只需将其删除。如果您有需要它的原因,您必须向我展示原因 - 可能有解决方法。

要解决第二个问题,请将 overflow: visible 添加到 input.submit

经过这两项更改后,它在 IE7 和 IE9 中看起来几乎相同:http://jsfiddle.net/33vmm/

关于css - IE7 中奇怪的 float 和填充,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7455389/

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