div元素高度问题

问题描述：

我一直在为我的网站的朋友工作的CSS布局，也许遇到了一些问题。希望你能帮助我。div元素高度问题

我有一个正文和内容博客div的HTML。除了内容博客div以外，一切似乎都正常。随着低于预定的设置，HTML输出仅返回我的博客内容DIV 与0的高度。然而，只有当我固定的高度，它显示正常的网页上。

我在这里的问题是，为什么它总是要求我一个固定的高度设置为在这种情况下，股利。任何参考CSS规范？这也是创建成小提琴这里：http://jsfiddle.net/benmore/yZL4U/1/ 虽然我的预期输出是在这里：http://jsfiddle.net/benmore/yZL4U/2/

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> 
    <head> 
     <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> 

     <style type="text/css"> 

      body{ 
       width: 960px; 
       margin-left:auto; 
       margin-right:auto ; 
       margin-top: 0px; 
       background:#5d9ab2 url(https://lh5.googleusercontent.com/-ZBLYo1oD6bM/UHox3oBICxI/AAAAAAAAAgo/yCg6TcxLeC4/s358/img_tree.png) no-repeat top left; 
       background-position: 200px 0px; 
       height: 100%; 
      } 


      .content_blog{ 
       background: url(https://lh4.googleusercontent.com/-6vbAw73oSYI/UHqHD-7GLlI/AAAAAAAAAg8/3eDurdBo2wE/s191/blog_topic.jpg) top left no-repeat; 
       width: 920px; 
       margin: 0px 20px 0px 20px; 
       /*-- height: 200px; --*/ 
      } 


     </style> 
     <title></title> 
    </head> 
    <body class="homepage"> 
     <div class="content_blog"></div> 
    </body> 
</html>

答

设置上。内容，博客DIV的最小高度为这里看到http://jsfiddle.net/calder12/yZL4U/4/原因是div实际上有没有CON帐篷。浏览器没有看到背景图像作为内容，因此它假定在div是空的，并用0高度使得它。

答

您使用yhis代码，而不是高度

.content_blog{ 
      background: url(https://lh4.googleusercontent.com/-6vbAw73oSYI/UHqHD-7GLlI/AAAAAAAAAg8/3eDurdBo2wE/s191/blog_topic.jpg) top left no-repeat; 
      width: 920px; 
      margin: 0px 20px 0px 20px; 
      min-height:500px; 
     }

最小高度使用动态高度问候

相关推荐