2011-12-18 69 views
0

也许有点奇怪的问题,但我坚持不过。CSS - 使用位置相对/绝对完全可见而不使用高度/最小高度的元素?

我有一个这样的元素结构:

<div class="one"> 
    <div> 
    <h3></h3> 
    <div class="two"></div> 
    </div> 
</div> 

这个CSS:

.one {position: relative; height: 50px; } 
.two {position: absolute; height: 500px; } 

是否有一个CSS方式,以确保。二是完全可见的,当我不能使用最小高度或高度的任何元素?

感谢您的帮助!

UPDATE
下面是一个例子:tab view

+0

它会有文字或其中的东西吗?如果它没有任何内容,为什么它需要可见。 – Robert 2011-12-18 20:51:02

+0

一个是制表符标题,两个是制表符内容,所以是的,里面会有内容。但无论哪种方式(内容/无内容),该元素都隐藏在它后面的内容后面 – frequent 2011-12-18 20:52:31

+0

可以发布一个完整的案例情况,它被隐藏起来。也许使用www.jsfiddle.net来模拟它。正如@Silver89建议的,也许一个明确的会修复它。 – Robert 2011-12-18 20:55:16

回答

0

Nopez不可能用纯CSS。

因为元素绝对定位到容器上并不知道它有多高。

虽然您可以使用Javascript解决方案。或者只是给容器一个高度。

+0

那么,为什么这个工作? https://jsfiddle.net/buc87c37/ – MEM 2015-11-18 17:25:25

1

不幸的是,由于.two是绝对定位的,因此无法让相对定位的.one自动扩展以适应其子的大小。但是,如果只需要.two可见,则可以将overflow: visible;样式规则应用于.one,这将允许.two扩展到其父级的底部边缘之外。

+0

哦,这听起来不错。让我尝试。 – frequent 2011-12-18 20:54:28

+0

无法正常工作。我举了一个例子来说明什么是错的。 Thx寻求帮助。 – frequent 2011-12-18 21:09:15

+0

因此,当你相对定位你的内容div时,其宽度限制为416像素。为什么不把你的内容div放入不同的父元素中,以便在相对定位时跨越页面的整个宽度,而不仅仅是一个标签的宽度?您已经在使用JavaScript,您不妨得到您的钱。 – Aaron 2011-12-18 21:35:00

相关问题