[问题] CSS Div Height的问题

楼主: KawasumiMai (さあ、死ぬがいい)   2015-02-10 14:42:12
<div id="A">
<div class="B">
<div class="c"></div>
<div class="d"></div>
</div>
<div class="B">
<div class="c"></div>
<div class="d"></div>
</div>
</div>
架构如上
div#A是主框架
div.B因为要自动排列在A里面所以用float:left
div.c和div.d因为要"重叠",所以采用position:absolute;去改left跟top
现在的问题是,div.c跟div.d会依照内容自行变更高度,这点没问题
但是div.B也想要依照内容的div.c和div.d里面最大高度进行扩展
(这关系到background-color跟border范围)
用height:auto会直接变成0,修改overflow也没用
因为感觉起来div.c和div.d是浮贴在上面的
div.b并没有抓到他们两个的内容高度
请问css要怎么解决?
作者: qui0914 (Q)   2015-02-10 15:01:00
请问重叠的意思是?
作者: oToToT (屁孩)   2015-02-10 15:08:00
你改成position:relative就会有高度,但可能要重算
作者: superpai (超级白)   2015-02-10 15:20:00
你这真是个好问题 解答如下http://codepen.io/minipai/pen/dPJYzg
楼主: KawasumiMai (さあ、死ぬがいい)   2015-02-10 17:01:00
感谢楼上,的确做出想要的感觉,不过想问细节.c跟.d只要做absolute就会跑版,一定得用float +margin-left:-100% 的方法进行叠合,原因是为什么?另外能自动判定内容高度的部分是因为box-sizing吗?
作者: lin009 (lin009)   2015-02-11 01:21:00
.c .d 是 absolute 的话, 定位参考点不一定会是 .B, 可能会往上找应该是这样啦~ 总之是 absolute 的性质
作者: iamnodoubt (Have Fun)   2015-02-11 03:28:00
用absolute就不是normal flow,简单讲就是跟b不同空间当然撑不开.你硬要用ap,google的答案都是用js处理反而麻烦..

Links booklink

Contact Us: admin [ a t ] ucptt.com