html – CSS – 使div的继承高度

前端之家收集整理的这篇文章主要介绍了html – CSS – 使div的继承高度前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我试图制作一个带有圆角的盒子,其中高度和宽度取决于内容,因此它会自动调整到…

你可以看到这里的例子:http://pastehtml.com/view/1duizyf.html

问题是我无法从“test_mid_center”(绿色背景)中获得“test_mid_left”(黑色背景)和“test_mid_right”(绿松石背景))的高度。我尝试了高度:100%和自动,但没有一个工作。那么如何让他们从内容中继承高度呢?

(为例,我在左边和右边的内容中使用“min-height:xx”的原因只是为了显示我正在谈论的框)

解决方法

如已经提到的,这不能用浮标来完成,他们不能继承高度,他们不知道他们的兄弟姐妹,所以例如侧面的两个浮点不知道中心内容的高度,所以他们不能继承从任何东西

通常继承的高度必须来自具有显式高度或高度的元素:100%;已经通过显示树传递给它..我知道的唯一的事情是通过高度不是从“树”的顶部是一个绝对定位的元素 – 所以你可以例如绝对位置所有右上角的左下角和角落(你知道角落的高度和宽度),而且你似乎知道宽度(左/右边界)和顶部/底部的高度)边框和顶部的宽度/底部中心,容易在100% – 唯一需要计算的是右侧/左侧的高度,如果内容增长 –

即使没有使用IE6 / 7不支持的所有四个定位坐标,也可以这样做

我已经根据你给出的一个例子,它依赖于一个固定的宽度(你的框架),但我认为它可以工作与一个灵活的宽度呢?对于那些花哨的图像边框来说,这种使用可能很酷,我们无法获得支持,直到多个背景图像或图像边框完全可用。谁知道,我在玩,所以只是把它粘在那里!

概念证明示例是here

猜你在找的HTML相关文章