Container/Wrapper Div不包含所有内容?

Imr*_*ran 7 css xhtml css-selectors

Container/Wrapper Div不包含所有内容(即所有子Div).我尝试过overflow:隐藏但仍然无效.有人可以告诉我为什么会这样,有什么可能的解决方案.

先感谢您 ;-)

由于某种原因整个代码不显示??

 <html>
     <head>
         <style type="text/css">
         #wrapper {
             margin:0 auto;
             width: 600px;
             background: yellow;    
         }
         </style>
     </head>

     <body>
         <div id="wrapper">
             <div="header">
                 <h1>my beautiful site</h1>
             </div>

             <div id="navigation">
                 <ul>
                     <li><a href="#">Home </li>
                     <li><a href="#">About</li>
                     <li><a href="#">Services</li>
                     <li><a href="#">Contact us </li>
                 </ul>
             </div>

             <div id="content">
                 <h2> subheading </h2>
                 <p>  long paragraph </p>
             </div>

             <div id="footer">
                  copyright 123
             </div>
         </div> 
     </body>
 </html>
Run Code Online (Sandbox Code Playgroud)

Ray*_*Ray 28

用我的水晶球,我会预测你的孩子divs漂浮而你的容器不是.在这种情况下,容器不会扩展以适合其内容.尝试浮动容器,看看会发生什么.

水晶一定是尘土飞扬......然而,你发布的代码是无效的 - 你有头标记内的内容和html标记之外的div.这是您的页面看起来如何,或者只是将代码粘贴到您的问题中的错误?尝试清理代码结构,看看它是否有帮助.

编辑:发现问题 - 这是一个错字.你有<div="header">- 它应该是<div id="header">(注意缺少'id')

  • 我认为你的水晶球可以预测未来.已经三年了,你的回答是我需要的(不是错字问题). (4认同)