p标签文本在页面后面

Question

scr显示了我的问题。基本上post.body用p标签包裹。仅当手动输入添加的文本（不是复制/粘贴）时，正文内容才会在页面后面

 <div class="row">
     <div class="col-md-9">
       <h4><%= @post.title %></h4>
           <p><small>by <%= @user.username %>, <%= time(@post) %></small></p>
           <p><%= @post.body %></p>
        </div>
        <div class="col-md-3">
          <!-- <div class="pull-right"> -->
                <img class="img-responsive" src="http://placehold.it/400x300" alt=""><br/>
            <!-- </div> -->
        </div>      
  </div>

up

当我只是复制一些文字（不是用手打字）时，我有这个

Answer 1

如果您想阻止无空间文本进入下一列的内容，强制换行包含word-break规则：

p {
    word-break: break-word;
}

演示：http://plnkr.co/edit/mRgD1Cw3plqBwBHxwCy1?p=preview

_{将鼠标悬停在文字上以查看word-break如何帮助。}