如何在不拉伸其自动宽度父元素的情况下将DIV拉伸到100%?

时间:2010-12-27 22:51:19

标签: html css width

鉴于DIV有几个内部DIV:

<div id="parent">
 <div id="a"></div>
 <div id="b"></div>
</div>

所有DIV都应具有相同的宽度,而它应该是最宽泛的DIV的宽度。父元素没有明确的宽度。

我怎样才能做到这一点?

我认为width: 100%会这样做,但它会将父元素拉伸到窗口大小。

草图:

################
#**************#
#*aaaaaaaaaaaa*#
#**************#
#*********     #
#*bbbbbbb*     #
#*********     #
################

应该是

################
#**************#
#*aaaaaaaaaaaa*#
#**************#
#**************#
#*bbbbbbb     *#
#**************#
################

#表示父DIV,它不会填满整个窗口。

2 个答案:

答案 0 :(得分:4)

首先,这种类型的CSS相关问题非常适合SO姐妹网站DocType,该网站专注于CSS和网站设计。

至于你的问题,div是块级元素,因此延伸到所有给定的空间。如果没有发生这种情况,那就意味着还有其他事情会覆盖这一点。要快速解决问题,请添加以下内容:

#parent {
    position: relative;
}

它可能会解决你的情况。如果没有,那么你在CSS中会遇到一些冲突,可能会提供一些代码或更具体的例子,我们可能会提供更多帮助。但是,正如SO FAQ中详述的那样,DocType更适合这样的问题。

答案 1 :(得分:-2)

div通常根据其内容进行拉伸。要使两个内部div具有相同的宽度,请将width指定为50%并将另一个指定为另一个的左侧。而且,使用clear:两者都在外部div。

请看一下这个很棒的资源:

http://www.maxdesign.com.au/articles/css-layouts/