2012-12-12 52 views
1

好吧,夥計們感謝幫助我解決了100%的高度問題。它現在的作品..div浮在div上的文本 - 不好

現在我有另一個問題。

我的HTML:

<div id="menu"> Test </div> 

<div id="content"> 

    <div id="submnu"> 
    Submenu 1 <br /> 
    <br /> 
    Submenu 2 <br /> 
    <br /> 
    Submenu 3 <br /> 
    <br /> 
    Submenu 4 <br /> 
    <br /> 
    Submenu 5 <br /> 
    <br /> 
    <br /> 
    LOGIN FORM<br /> 
    <br /> 
    <form method="POST" action="...php"> 
    Username:<br /> 
    <input type="text" name="username" style="width: 200px; border: #373c39 double 2px;" /><br /><br /> 
    Password:<br /> 
    <input type="password" name="password" style="width: 200px; border: #373c39 double 2px;" /><br /><br /> 
    <input type="submit" value="Login" /> 
    </form> 


    </div> 

    <div id="txt"> 
    <table> 
    <tr> 
    <td> 
    <img src="images/producttest.png" border="0" /> 
    </td> 
    <td align="left" valign="top" style="padding-top: 50px;"> 
    Productomschrijving: <br /> 
    <p> 

    <div id="scimg"> 
    Winkelwagen<br /> 
    </div> 

    Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.<br /> 
    Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. 
    <br />Donec eu libero sit amet quam egesta semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. 
    <br />Quisque sit amet est et sapien ullamcorper pharetra. 
    <br />Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. 
    <br /><br /> 
    Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci,<br /> 
    sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis.<br /> 
    Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue,<br /> 
    eu vulputate magna eros eu erat. Aliquam erat volutpat.<br /> 
    Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus 
    <br /><br /> 
    Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.<br /> 
    Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. 
    <br />Donec eu libero sit amet quam egesta semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. 
    <br />Quisque sit amet est et sapien ullamcorper pharetra. 
    <br />Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. 
    <br /><br /> 
    Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci,<br /> 
    sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis.<br /> 
    Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue,<br /> 
    eu vulputate magna eros eu erat. Aliquam erat volutpat.<br /> 
    Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus 
    </p> 

    </tr> 
    </table> 
    </div> 

</div> 

而且我的CSS:

html { 
    height: 100%; 
} 
body { 
    background-color: #28B04B; 
    margin: 0; 
    font-family: Verdana, Geneva, sans-serif; 
    font-size: 12px; 
    height: 100%; 
} 
#head { 
    height: 147px; 
    overflow: auto; 
    width: 1297px; 
} 
#logo { 
    background-image: url("images/logo.png"); 
    background-position: left center; 
    background-repeat: no-repeat; 
    float: left; 
    height: 147px; 
    width: 297px; 
} 
#header { 
    background-image: url("images/headbg.png"); 
    background-repeat: no-repeat; 
    float: left; 
    height: 147px; 
    width: 1000px; 
} 
#menu { 
    background-color: #d4efdb; 
    border-bottom: 2px double #373C39; 
    border-top: 2px double #373C39; 
    height: 30px; 
    padding-left: 320px; 
} 
#content { 
    background-color: #e9f7ed; 
    height: 100%; 
    overflow: hidden; 
    min-height: 100%; 
} 
#txt { 
    margin-left: 320px; 
    margin-top: 10px; 
} 
#submnu { 
    background-color: #d4efdb; 
    width: 247px; 
    min-height: 100%; 
    overflow: hidden; 
    float: left; 
    padding-left: 50px; 
    padding-top: 20px; 
    display: block; 
} 
#scimg { 
    background-image: url(images/scimg.png); 
    background-repeat: no-repeat; 
    width: 210px; 
    height: 310px; 
    z-index: 10; 
    position: absolute; 
    right: 0; 
    top: 50; 
    padding-top: 20px; 
    padding-left: 20px; 
} 

我創建了一個購物車(DIV ID:scimg)。 但當我看到它在較低的分辨率。購物車的div流過上下文文本。我該如何解決這個問題? 希望能儘快收到您的來信!

+1

不改變原來的問題創建一個新的答案,並重新加載這個老問題在這種情況下,對於其他幫助傢伙,有你的ld問題 –

回答

1

加高度:在DIV含量100%
觀看演示:

DEMO

#content { 
    background-color: #e9f7ed; 
    min-height: 100%; 
    height:100%; 
    overflow: hidden; 
} 
+0

很好它的工作.. – ashiekg

+2

如果你已經解決了你的問題,這個答案接受它,這是如何工作stackoverflow @ashiekg –