2012-12-13 100 views
0

我不能讓我的內容進入一個包裝,它只是顯示在左側我的內容不會進入包裝

<div id="middle"> 
    <div class="wrapper"> 
    <div id="image_rose"><img src="assets/rose.jpg"/></div> 
    <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci.</p> 
    <img src="assets/leef.png" /> 
    <p>Text Input:</p> 

CSS:

.wrapper{ 
    background-color:#666666; 
    width:900px; 
    margin:0px auto; 
    text-align:left; 
} 

#middle{ 
    background-color:#666; 
    width:900px; 
    float:left;} 
+0

你是什麼意思,「它不會進入包裝?」如果#middle是浮動的,它將不會「環繞」內容,除非它具有特定的高度或者已經清除了浮動。 – Kyle

回答

3

你把你的內容和包裝到#middle中,它會左移。包裝是相同的大小和中間,所以將只在左側的網站。

0

試試這個佈局圍繞你的中間內容

HTML

<div id="wrapper"> 

    <div id="middle"> 

    </div> 

</div> 

CSS

#wrapper 
{ 
width:100%; 
padding:0px; 
margin:0px; 
} 

#middle 
{ 
margin:0 auto; 
width: 600px; 
} 
1

您可以清除浮動,如下圖所示: 明確:既

1

如果內容顯示在div之外,則可以嘗試向css中的特定div添加overflow: hidden;或不同的溢出設置。