gpt4 book ai didi

css - 防止嵌套的 DIV 换行(不指定父宽度)

转载 作者:行者123 更新时间:2023-11-28 15:02:54 30 4
gpt4 key购买 nike

在下面的代码中,我有 2 个 div,每个都有两个嵌套的 div。当在 Firefox/IE8 下调整浏览器窗口大小时一切正常——最右边的父 div 落在第一个之下。

但是在 IE6(或具有兼容模式的 IE8)下,子 div 在第二个 div 换行中。更糟糕的是,尽管我已经为 div 设置了最大高度,但它还是发生了。

在这种情况下,如何使 IE6 的行为像 IE8/Firefox 一样?我怎样才能告诉 DIV 不要换行?请注意,文本是动态的,因此我无法为父级设置宽度。

<!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 runat="server">
<title></title>
<style type="text/css">
.parent
{
float: left;
border: solid 1px black;
height: 30px;
white-space: nowrap;
}

.child
{
float: left;
border: solid 1px grey;
width: auto;
}

</style>
</head>
<body>
<form id="form1" runat="server">
<div class="parent">
<div class="child">
What is up, guy What is up, guy
</div>
<div class="child">
What is up, guy What is up, guy
</div>
</div>
<div class="parent">
<div class="child">
What is up, guy What is up, guy
</div>
<div class="child">
What is up, guy What is up, guy
</div>
</div>
</form>
</body>
</html>

最佳答案

您可以使用条件注释让 IE 使用 height,并在其他任何地方使用 max-height

<link rel="stylesheet" type="text/css" href="path/to/stylesheet" />

<!--[if IE 6]>
<style type="text/css">
.parent {
height: 30px;
}
</style>
<![endif]-->

关于css - 防止嵌套的 DIV 换行(不指定父宽度),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1358133/

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