Html 如何防止文本流到页面的不同部分？

我正在用水平视差构建一个网页。我把一个长页面分成了不同的

div

标签。但是，如何将文本保留到特定的部分，而不使其流到页面的不同部分？我试过

wordwrap:break-word

，但没用。网站：

HTML:

<div id="transition-slide-container">               
            <div id="transition-slide"><!--begin transition-slide-->           
                <div class="slide" id="home"><!--begin home-->
                    <div id="inner-container">
                        <div id="title"><h2>Hey there!</h2></div>   
                        <div class="row" id="homepage">
                                       <div class="small-12 columns">
                                            <p>Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. Text. </p>
                                       </div>
                                  </div>
                    </div>
                </div><!-- end home-->
</div>  

---

好的，你要做的是在每个div上做一个max width或者仅仅是一个width，因为我注意到那里没有max width和width，所以确保你在每个div上都有一个width，因为一个div可以重叠另一个div，如果它没有设置任何宽度的话。另外

好的，你要做的是在每个div上设置一个最大宽度，或者仅仅是一个宽度，因为我注意到那里没有最大宽度和宽度，所以确保你在每个div上都有一个宽度，因为一个div可以重叠另一个div，如果它没有任何宽度设置。另外

设置

空白：正常.internal container

上进行code>以使文本在其内部换行

设置

空白：正常.internal container

上进行code>以使文本在其内部进行换行

我同意koala_dev的观点，但是我想补充一下为什么即使您的单词是间隔的，也会发生这种情况，原因是您在此处将文本设置为不换行：

div#transition-slide {
 white-space: nowrap;
 left: 0;
}

因此，删除这个

空白：nowrap

通过此选择器，您可以确保文本换行，这样您就不需要添加额外的标记来换行

重申你说的话：不要包装。。。然后包装。。。为什么不说“不包装”并让它默认包装

---

另一方面，如果您在添加没有空格的单词（例如长URL）时担心文本没有包装，那么文本往往会流出容器。。。然后你可以使用

wordwrap:break-word

在CSS父容器中。

我同意koala_dev的观点，但是我想补充一下为什么即使单词是空格，也会发生这种情况，原因是您将文本设置为不在此处换行：

div#transition-slide {
 white-space: nowrap;
 left: 0;
}

因此，删除这个

空白：nowrap

通过此选择器，您可以确保文本换行，这样您就不需要添加额外的标记来换行

重申你说的话：不要包装。。。然后包装。。。为什么不说“不包装”并让它默认包装

---

另一方面，如果您在添加没有空格的单词（例如长URL）时担心文本没有包装，那么文本往往会流出容器。。。然后你可以使用

wordwrap:break-word在CSS父容器中。
他需要禁用主容器上的包装，以便所有“幻灯片”水平排列。他需要禁用主容器上的包装，以便所有“幻灯片”水平排列