Question

我正在尝试创建一个简单的网页，但我无法将页面包装在正文部分，滚动条或否。页面上的文字不断进入无限。 CSS表格如下：

@charset "utf-8";

*{
background-color:#CCC;
margin:0;
padding:0;
}

body {
    font-family: Verdana, Geneva, sans-serif;
    font-size: 15px;
    font-style: normal;
    color: #609;
    text-align:left;
}

#container
 {
    margin-left:auto;
    margin-right:auto;
    background-color: #CCC;
    height: 768px;
    width: 1366px;
    border: thin solid #FFF;
}

#header 
{
    height: 50px;
    width: 1214px;
    border-bottom-width: thin;
    border-bottom-style: solid;
    border-bottom-color: #FFF;
    clear: right;
    float: right;
    border-right-width: thin;
    border-right-style: solid;
    border-right-color: #FFF;
}

#sitelogo 
{
    float: left;
    height: 101px;
    width: 150px;
    border-bottom-width: thin;
    border-bottom-style: solid;
    border-right-color: #FFF;
    border-bottom-color: #FFF;
    border-left-color: #FFF;
    border-right-width: thin;
    border-right-style: solid;
    border-top-color: #FFF;
}

#lrftnavbar 
{
    clear:both ;
    float: left;
    height: 616px;
    width: 150px;
    border-right-width: thin;
    border-right-style: solid;
    border-right-color: #FFF;
}

#navbar
 {
    float: right;
    height: 50px;
    width: 1214px;
    border-bottom-width: thin;
    border-bottom-style: solid;
    border-bottom-color: #FFF;
    border-right-width: thin;
    border-right-style: solid;
    border-right-color: #FFF;
}

#footer
 {
    clear: both;
    float: left;
    height: 50px;
    width: 1353px;
    border-top-width: thin;
    border-top-style: solid;
    border-top-color: #FFF;
}

#body 
{
    background-color: #CCC;
    height: 610px;
    width: 1180px;
    white-space: nowrap;
    overflow: scroll;
    float: left;
    clear: none;
    padding: 15px; 
    margin:auto;
}

.new 
{
    font-size: 9px;
    font-style: italic;
    color: #630;
    background-color: #0FF;

}

#utube 
{
    background-color: #CCC;
    float: left;
    height: 240px;
    width: 320px;
    border: thin solid #FFF;
    margin-top: 0px;
    margin-right: 15px;
    margin-bottom: 15px;
    margin-left: 0px;
}

我放入HTML #body div的内容继续进行，尽管容器并没有进入下一行。此外，文本位于youtube div之上，位于其上方和顶部导航栏（navbar）的边界之间。有没有正确的方法来解决它？在那里放一个保证金只会让youtube div进一步向下移动。任何帮助表示感谢，请随时要求进一步澄清。

Answer 1

尝试从white-space: nowrap;删除#body。

您可以在此处详细了解white-space属性：http://www.w3schools.com/cssref/pr_text_white-space.asp

Dreamweaver CSS - 文本不会换行

1 个答案: