水木社区手机版
- 主题:弱问如下情况的自适应高度CSS怎么调
- 就是一个块A内包含B、C两个块，要求A、B、C三个块的高度均取B、C两者中较高的那一个。
网页示意如下：
<div id="A">
<div id="B">
balabala...
</div>
<div id='C'>
balabala...
</div>
</div>
设定B、Cheight为100%或者auto都不行
多谢！！
--
FROM 202.120.79.* - 如果可以float:left的话，用这个
【 在 HGL (荆棘) 的大作中提到: 】
: 就是一个块A内包含B、C两个块，要求A、B、C三个块的高度均取B、C两者中较高的那一个。
: 网页示意如下：
: <div id="A">
: ...................
--
FROM 111.161.96.* - B, C是用float并排的么？如果是的话，那可以在C后面放个div，clear一下
【 在 HGL (荆棘) 的大作中提到: 】
: 就是一个块A内包含B、C两个块，要求A、B、C三个块的高度均取B、C两者中较高的那一个。
: 网页示意如下：
: <div id="A">
: ...................
--
FROM 64.104.125.* - 是的float:left
【 在 liangqing (^-^) 的大作中提到: 】
: B, C是用float并排的么？如果是的话，那可以在C后面放个div，clear一下
--
FROM 202.120.79.* - 就是float:left,用什么？
【 在 aotian (aotian) 的大作中提到: 】
: 如果可以float:left的话，用这个
--
FROM 202.120.79.* - 在外层用float
【 在 HGL (荆棘) 的大作中提到: 】
: 就是float:left,用什么？
--
FROM 111.161.96.* - <style>
#D{
clear:both;
height:0px;
}
</style>
<div id="A">
<div id="B">
balabala...
</div>
<div id='C'>
balabala...
</div>
<div id='D'>
</div>
</div>
【 在 HGL (荆棘) 的大作中提到: 】
: 标 题: Re: 弱问如下情况的自适应高度CSS怎么调
: 发信站: 水木社区 (Thu Feb 21 11:19:04 2013), 站内
:
: 是的float:left
: 【 在 liangqing (^-^) 的大作中提到: 】
: : B, C是用float并排的么？如果是的话，那可以在C后面放个div，clear一下
:
:
: --
:
: ※ 来源:·水木社区 newsmth.net·[FROM: 202.120.79.*]
--
FROM 64.104.125.* - 似乎不行啊，按这个写了个测试页面：
<!DOCTYPE html>
<html lang="en">
<head>
<style>
#A{
float: left;
}
#B{
float: left;
background: red;
border: 2px #480091;
color: white;
}
#C{
float: left;
background: blue;
border: 2px #480091;
color: white;
}
#D{
clear:both;
height:0px;
}
</style>
</head>
<body>
<div id="A">
<div id="B">
<p style="padding: 100px 20px"> B div </p>
</div>
<div id='C'>
<p style="padding: 200px 20px"> C div </p>
</div>
<div id='D'>
</div>
</div>
</body>
</html>
结果如附件所示
【 在 liangqing (^-^) 的大作中提到: 】
: <style>
: #D{
: clear:both;
: ...................
--
修改:HGL FROM 202.120.79.*
FROM 202.120.79.* - 原来是要B,C同步变高，理解错误，不好意思
如果不用js的话， 可以用table-cell来实现的，对于css不支持table-cell的浏览器，那就必须改A为table了
http://jsfiddle.net/liangqing/EBUJS/
【 在 HGL (荆棘) 的大作中提到: 】
: 似乎不行啊，按这个写了个测试页面：
: <!DOCTYPE html>
: <html lang="en">
: ...................
--
修改:liangqing FROM 64.104.125.*
FROM 64.104.125.* - 你要BC一样高？那恐怕只能用js了
【 在 HGL (荆棘) 的大作中提到: 】
: 谢谢，不过似乎B、C的高度没有同步变化，只是把最外面框的撑大了。
: 添加一个背景色就能看出来了。或者firefox审查元素也能看出来
--
FROM 111.161.96.*