2012-06-22 57 views
0

大家好我有HTML代码,这样宽度包装DIV和内容的权利应取决于内容的内容增加宽度的右

<html> 
<head> 
<style type="text/css"> 
body {  
font-family:arial,helvetica,sans-serif;  
font-size:12px; background-color: blue; 
} 

**#wrapper {   
width:900px;   
margin:0px auto;   
border:1px solid #bbb;  
padding:10px; background-color: pink; 
}** 

#header 
{  
border:1px solid #bbb;  
height:80px;   
padding:10px; 
} 
#content 
{  
margin-top:10px;   
padding-bottom:10px;  
} 
#content div 
{  
padding:10px;  
border:1px solid #bbb;  
float:left; 
} 
**#images 
{ 
position:relative; 
top:0px; 
}** 
#content-left 
{  
width:380px;  
}  
**#content-right 
{ 
position:relative; 
top:0px;   
margin-left:10px;  
width:534px;  
}** 
#footer 
{  
float:left;  
margin-top:10px;   
margin-bottom:10px;  
padding:10px;  
border:1px solid #bbb;  
width:878px;  
} 
#bottom 
{  
clear:both;  
text-align:right; 
} 



</style> 
</head> 

<body> 
<div id="wrapper"> 
<div id="header">Header</div> 
<div id="content">  
<div id="content-left"></div>  
**<div id="content-right"><div id="images"><img src="pics02.jpg"  
width="300px;height="900px" /></div>** 
</div> 
</div> 
<div id="footer"></div> 
<div id="bottom"></div> 
</div> 
</body> 
</html> 

我想如果我插入内容的权利一些内容的问题如果内容的宽度超过了内容的宽度,则第一个内容的权利应该扩大,然后包装器应该扩展,但这不会发生在那里,并且正在从包装器中出来。任何人都可以指导我如何着手。

+0

你应该接受答案 –

回答

1

您已修正内容的宽度。所以它不会!它可以调整高度,但它不会调整宽度..你可以使用最小宽度属性来设置内容的最小宽度 - 右... http://www.w3schools.com/cssref/pr_dim_min-width.asp

+0

,但如果我使用min-宽度,如果内容更多,则内容右侧将位于内容左下方。如果我们放大或缩小的内容也将改变。谢谢你的回复 – satish

+0

首先!你为什么想在你的div中添加那种溢出的内容?在CSS中,我们创建了一个固定的结构,然后将内容放入其中。内容维度可能会在父容器的维度范围内发生变化,但不会超过这个范围,这是一种糟糕的CSS练习。如果你喜欢,你可以从最初阶段增加内容的宽度。 –

+0

因此,根据内容无法动态增加宽度。我们需要调整内容的宽度大小,并且需要在相应的内容中显示 - 右键。如果有任何方法,我们可以动态调整我们的内容,只是更新我。谢谢。 – satish