php中的自动换行答案

【问题标题】：Word-wrap in phpphp中的自动换行
【发布时间】：2015-12-01 10:17:47
【问题描述】：

在内容完整类中，我使用了自动换行：break-word;文本仍然没有以正确的格式出现？可能的解决方案是什么？是否有某种方法可以获得正确的格式，以便允许长单词能够中断并换行到下一行。但奇怪的部分是对于内容简短的 word-wrap:break-word 有效！

echo "<div class='mainlayout' data-js-module='layout'>";
echo "<div class='grid' style='position: relative;'>";
include "mysql.php";
$query= "SELECT ID,Title,Summary,Content,ImgName,Image FROM content ORDER BY ID DESC";
$result=mysql_query($query,$db);
while($row=mysql_fetch_array($result)) {  
    echo "<div class='grid-item item1' style='position: relative; left: 240px; top: 0px; background: ".ran_col().";'>";           
    echo "<div class='content-short' style='position:relative;'>";
    $string = $row['Content'];
    if (strlen($string) > 200) {
        $trimstring = substr($string, 0,200). '...';
        } 
        else {
            $trimstring = substr($string,0). '...';
            }
    echo $trimstring;
    echo "</div>";
    echo "<div class='content-full'>";
    echo $row['Content'];
    echo "</div>";
    echo "</div>";
    }
mysql_close($db); 
echo "</div>";
echo "</div>";  
?>

以及内容完整的样式

<style type="text/css>
    .content-full{
        border: 1px;
        border-radius: 5px;
        word-wrap: break-word;
        width: 100%;
        height: 100%;
        padding: 5px 5px 5px 10px;
        overflow-y: auto;
        float: left;
        background: white;}
    .content-short {
        float: left;
        position: relative;
        border: 1px;
        border-radius: 5px;
        margin: 10px 0 0 10px;
        padding: 10px 0 10px 10px;
        word-wrap: break-word;
        height: auto;
        width: 200px;
        background: White;}
</style>

【问题讨论】：

如果你的类名是“content-full”，为什么要把它设置为“content-full-data”？
感谢您的编辑。我只是将其更改为 .content-full 这是一个输入错误@Arturo
你试过添加“display: inline-block”吗？
是的，我还有同样的问题@Arturo

标签： javascript php html css forms

【解决方案1】：

我遇到了同样的问题，我使用的是 docx 文件中的文本，并且在上传时我使用了 pre 标签，因此自动换行无法正常工作。如果这是您的情况，请删除 pre 标签。

【讨论】：

【解决方案2】：

这是你想要完成的吗？ https://jsfiddle.net/9s2zr7gL/ 如果是这样，只需将其添加到您当前的 CSS 中：

-ms-word-break: break-all;
 word-break: break-word;
-webkit-hyphens: auto;
   -moz-hyphens: auto;
    -ms-hyphens: auto;
        hyphens: auto;

您还需要在 div 中添加“lang=en”作为参数。否则它将无法在Firefox中运行。如果您的文本不是英文，请检查该语言是否受支持： https://developer.mozilla.org/en-US/docs/Web/CSS/hyphens

【讨论】：

我想实现与您提供的 jsfiddle 链接相同的功能，但它对我不起作用@Arturo
@aryan_kanwar 检查影响该 div 的所有 CSS 属性，如果它在 jsfiddle 中工作，它必须为你工作。你的文字是用什么语言写的？
英文@Arturo
@aryan_kanwar 您是否已将 lang="en" 参数添加到您的 div 中？
@aryan_kanwar 你能用你的非工作内容尝试创建一个 jsfiddle 并将其链接到这里吗？

【解决方案3】：

更新：

如果是外部的，它会像：

<link rel="stylesheet" type="text/css" href="pathto.css">

父div绕过这个div样式，尝试改变父div的样式如下：

改变这一行：

 echo "<div class='grid-item item1' style='position: relative; left: 240px; top: 0px; background: ".ran_col().";'>";

通过这个：

 echo "<div class='grid-item item1' style='position: relative; word-wrap: break-word; left: 240px; top: 0px; background: ".ran_col().";'>";

它将继承您提到的 div

【讨论】：

我使用了外部样式表@Mohammed Elhag
谢谢，但我写了正确的课程@Mohammed Elhag
我确定上面的 div ，
那还是没有效果@Mohammed Elhag