Question

当达到最大宽度时，位于div内部的<p>标记不会中断。我知道任何事情都不需要一些代码，但我甚至不知道......

<body>

    <div id="bigBox">

        <div id="body">         
            <h1>Min profilsida</h1>

            <div id="navBar">
                <ul>
                    <li><a href="ProfilSida.html">Hem</a></li>
                    <li><a href="CvSida.html">Cv</a></li>
                    <li><a href="PortfolioSida.html">Portfolio</a></li>
                </ul>
            </div>

        <h2>Mitt namn är Albin Öhman</h2>

        <img src="bilder/Albiegrdn.png">    

        <div class="textbox">
            <p>fgodsfjklgdsflgjhhhhhhhhyukggggggggggggggggggggggggggggggggggggyyygdsfdsssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss</p>
        </div>

        </div>


    </div>

</body>



 #body{
    overflow: hidden;
    position: relative;
    border-radius: 5px;
    width: 850px;
    height: 790px;
    margin: 0px auto;
    top: 10px;
    background-color: #808080;
}


 .textbox{
    padding: 10px;
    background-color: red;
    width: 425px;
    height: 500px;
    position: relative;
    left: 350px;
    top: -450px;
}





   body{
    width: 1000px;
    margin: 0px auto;
    position: relative;
    background-image: url("background.jpg");
    background-repeat: no-repeat;
    background-attachment: fixed;
}

#bigBox{
    padding: 0;
    background-color: #424747;
    width: 1000px;
    height: 810px;
    position: relative;
}

Answer 1

这应该有所帮助：

p {
    word-break: break-all;
}

或更一般的财产：

p {
    word-wrap: break-word;
}

段落不会打破非间隔词，除非你告诉它：

＆＃13;

.textbox{
    padding: 10px;
    background-color: red;
    width: 425px;
    height: 500px;
}

p {
    word-break: break-all;
}

＆＃13;

<div class="textbox">
  <p>fgodsfjklgdsflgjhhhhhhhhyukggggggggggggggggggggggggggggggggggggyyygdsfdsssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss</p>
</div>

＆＃13;

Answer 2

你是什么意思＆＃34;达到最大宽度时不会破坏？＆＃34;你指的是继续传递

内容的宽度吗？如果有，那么试试这篇文章

Wordwrap within css div

所以你需要做的就是将水平溢出设置为滚动，这样你就可以根据需要左右滚动，或者打开word_wrap，一旦它到达宽度的末端，它就会启动一条新线。

Answer 3

实际上，您实际上并未将宽度设置为任何宽度。如果其中的文本没有空格也不会破坏。该字符串需要被拆分，以便在给定的行空间中断开

HTML / CSS文本不会跟随div

3 个答案: