0 
**html**
<html>
<head>
<link rel="stylesheet" href="style.css" ... />
</head>

<body>

<div id="wrapper">  
<div id="header">
<div id="comcast"><img src=Desert.jpg width="18px" height="40px"></img></div>
<div id="menu"><img src=Hydrangeas.jpg width="48px" height="40px"></img></div>
</div>  
<div id="content">      
<div id="content-left"><img src=Desert.jpg width="180px"      height="1000px"></img></div>      
<div id="content-main"><img src=Hydrangeas.jpg width="700px"  height="1000px"></img></div>      
</div>  
<div id="footer"></div> 
<div id="bottom"></div>
</div>

</body>
</html>





**css**
body 
{       
 font-family:arial,helvetica,sans-serif;        
 font-size:12px;    
}


#wrapper 
{       

 margin:0px auto;       
 border:1px solid #bbb;     
 padding:10px;  

}

#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;    
}   
#content-left 
{       
width:180px;    
}   
#content-main 
{       
 margin-left:10px;      
 width:700px;   
}   

#footer 
{       
float:left;     
margin-top:10px;        
margin-bottom:10px;     
padding:10px;       
border:1px solid #bbb;      
width:878px;    
}   
#bottom 
{       
clear:both;     
text-align:right;   
}

*{
margin:0px;
 }

#menu
{
float:right;
}

问题是如果我向左放大或缩小内容并且内容主 div 混乱。我的要求是如果我们放大或缩小 contentleft 和 contentmain 它应该像这样缩小并且它不应该是混乱的。我怎样才能做到这一点.

4

1 回答 1

1

在专门处理该问题之前，您需要修复一些 HTML suntax/validation 问题

<img src=Hydrangeas.jpg width="48px" height="40px"></img>

应该

<img src="Hydrangeas.jpg" width="48" height="40" />
  1. 在“”中包装属性
  2. 像素在宽度和高度上没有要求。
  3. 删除并终止打开标记为 />
于 2012-05-11T14:07:24.423 回答