如何在div周围包装文本

Question

我正在与css进行斗争，以便在div中包装文本。我已经应用了白色间距，但没有发生任何事情。

链接http://fiduciaryconsulting.org/index.php/services/90-services/200-demo

Screenshot of section with issue

Answer 1

从选择器white-space: nowrap移除.boxes li a，它将起作用

Answer 2

从链接标记中删除white-space: nowrap;。

查看这些文章，了解有关包装长词和网址的更多信息：

• https://css-tricks.com/snippets/css/prevent-long-urls-from-breaking-out-of-container/
• https://kenneth.io/blog/2012/03/04/word-wrapping-hypernation-using-css/
• https://justmarkup.com/log/2015/07/dealing-with-long-words-in-css/

Answer 3

white-space: nowrap;将是这个问题的罪魁祸首。将其从以下CSS中删除，或者您可以将其注释掉，如下所示：

.boxes li a {
    color: #fff;
    display: block;
    padding: 60px 10px 60px 10px;
    text-decoration: none;
    background-color: #3366ff;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    min-height: 30px;
    word-wrap: break-word;
    /* white-space: nowrap; */
}

您可以在文件的第29-44行找到此选择器的CSS规则：http://fiduciaryconsulting.org/templates/jsn_pixel_free/css/template.css