【问题标题】:text overflowing div with php echo带有php echo的文本溢出div
【发布时间】:2020-06-07 16:11:02
【问题描述】:

我正在制作我的第一个全栈项目。我做了这个博客,你可以在上面发帖和评论,所有的帖子和cmet都存储在mysqli数据库中。

为了在加载页面时获取数据库中的所有数据,我使用 php 将所有这些数据存储在一个数组中,然后在网页上回显这些数据。

它在页面上设置、获取和显示数据的部分很好。但是,当我从数组中回显数据(从数据库表中获取数据)时,文本会溢出我的 div……我用 CSS 和引导程序尝试了所有方法,但它不起作用。

我不知道为什么,我尝试了很多东西,但过去 2 天我一直卡在这个问题上。

请原谅我代码的不良做法,我是初级,主要是前端。这是我第一次尝试全栈项目,所以我在编写代码时自己学习。

 <?php foreach($datas as $value): ?>

<?php 


$id = $value['id'];
echo $id;

$imgSrc = $value['image'];

echo
"<div class='container-fluid' style='text-align: center; padding: 5% '>
<div class='row'>
<h1 id='titlePost' class='col-md-8 mx-auto'>" . $value['title'] . "</h1>".
"<hr class='w-50' style='height: 6px; background-color: #03fc84 !important;  margin-left: auto; margin-right: auto;'>".
"
<div class='row col-12'>
<img src='$imgSrc' class='img-fluid col-md-4 mx-auto'>
</div>

<div class='container-fluid'>
 <div class='row col-12'>
    <p class='col-md-8' >" . $value['description'] . "</p>
</div>
</div>
".
    "<p style='color: black;  background-color: #03fc84;' class='w-50 mx-auto'>" . $value['date'] . "</p>".
    
    
    "<div class='container-fluid'>
    <div class='row col-md-12'>
    <form action='".setComments($conn, $id, $sessionComments)."' method='post' enctype='multipart/form-data' class='col-md-8 mx-auto'>
    
    <input name='comments' type='text' class='form-control' id='exampleFormControlInput1' >
    

选择要上传的图片:

<button type='submit' name='commentSubmit$id'  id='btnSend' class='w-25 mx-auto btn btn-primary'>Comment
<i class='fas fa-paper-plane' style='font-size: 2.5rem; color : #ff6016; display: inline-block;'></i>
</button>

    
    </form>
    ".

"
</div>
</div>
</div>
</div>"; 

// afficher les commentaires
getComments($conn, $commentsArray, $id);


?>




<?php endforeach ?>

【问题讨论】:

    标签: php html mysql


    【解决方案1】:

    您可以查看this link,它解释了如何使 div 高度取决于其内容,同样的事情可以与width 属性一起使用(显然它取决于您编写的代码)。

    否则,如果您不喜欢这个解决方案,我不得不问您是否尝试过overflow-x: scroll;(宽度溢出)和/或overflow-y: scroll;(高度溢出):这些属性以及这些值允许您调整具有指定大小的 div(例如:width: 100px 或 width: 100px),以便能够滚动其内容。

    希望我能帮助您解决此问题。 顺便说一句,我想给你一个关于这个社区的提示:为了更快更好地回答问题,你也应该提供 CSS 代码。

    【讨论】:

    • 我试过了,可惜没用。即使是内联样式或在半列之前添加 !important。
    • 感谢帮助的哥们,我一直在寻找,我发现用php,当你尝试回显来自字符串的文本时,你必须添加以下css:
    • 分词:断词;所以这会尽可能多地破坏你的字符串以使其适合你的 div
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-04-03
    • 1970-01-01
    • 2022-12-15
    • 1970-01-01
    • 2015-05-20
    • 2017-10-17
    相关资源
    最近更新 更多