文本从容器中流出,它只出现在一行中,然后从页面中流出

Text is going out of the container and it's appearing in just one line and goes out of the page

提问人:Yusuf Khan 提问时间:10/4/2023 最后编辑:tripleeeYusuf Khan 更新时间:10/4/2023 访问量:52

问:

我正在尝试使用 Django admin 中的富文本上传字段将一些文本添加到我的项目详细信息部分。它应该在一个段落中,因为我在我的 Django 管理项目描述中添加了它们,但它显示了一行,并且它也从容器中出来,但它在容器的左侧提供了空间,但没有在容器的右侧,它离开了页面。

这是我的页面:project-details.html

{% extends "base.html" %}
{% load static %}
{% static "images" as baseUrl %}

{% block title %}{{projectdetails.title}}{% endblock %}

<!--header block -->
{% block header %}

<!-- Slider Start -->

<section class="section about">
    <div class="container">{{projectdetails.desc|safe}}</div>
        

</section>


<!--slider ends -->

<!-- footer Start -->

{% block footer %}

<!--Essential Scripts -->

{% block Scripts %}


{% endblock %}
{% endblock %}
{% endblock %}

这是我的页面:project.html

{% extends "base.html" %}
{% load static %}
{% static "images" as baseUrl %}

{% block title %}Project{% endblock %}

<!--header block -->

{% block header %}
<!-- slider starts -->
</div>
<div class="typing">
    <p class="type4"></p>

</div>

<!-- section portfolio start -->
<section class="section box">
    <div class="container">
        <div class="row justify-content-center">
            <div class="col-lg-8">
                <div class="heading text-center">
                    <p>We have the best experts to elevate your business to the next level, try is and you will see! We have the best experts to elevate your </p>
                </div>
            </div>
        </div>
    </div>

    <div class="container">
        <div class="row ">
            {% for projects in projectdetails %}
            <div class="col-lg-4 col-md-6">
                <div class="portflio-item position-relative mb-4">
                    <a href="{% url 'project-details' id=projects.id %}" >
                        <img src="{{projects.img.url}}" alt="" class="img-fluid w-100">
                        <div class="overlay-item"><i class="ti-link"></i></div> 
                        
                        <div class="portfolio-item-content">
                            <h3 class="mb-0 text-white">{{projects.title}}</h3>
                            <p class="text-white-50">{{projects.category}}</p>
                        </div>
                    </a>
                </div>
            </div>
            {% endfor %}
        </div>
    </div>
</section>

<!--slider ends -->

<!-- footer Start -->
{% block footer %}

<!-- section portfolio END -->

{% endblock %}
{% endblock %}

这是我的部分:models.py

class projectdetail(models.Model):
    title = models.CharField(max_length=100)
    desc = RichTextUploadingField(blank=True, null=True)
    category = models.ForeignKey(category, on_delete=models.CASCADE)
    client =models.CharField(max_length=100)
    startdate = models.DateTimeField(auto_now=False,auto_now_add=False)
    enddate = models.DateTimeField(auto_now=False,auto_now_add=False)
    img = models.ImageField(upload_to='pics')
    url = models.URLField(
        validators=[URLValidator(message="Enter a valid URL.")]
    )

现在我正面临这个问题,如图所示。

project-details.html page picture

我想像容器中的段落一样正确地显示这些行。

HTML CSS django 富文本编辑器 django-ckeditor

评论

0赞 jessman5 10/4/2023
请提供工作代码片段以重现问题
1赞 jessman5 10/4/2023
如果内容是一长串重复字符,则自然行为就是屏幕截图中的内容。它不会中断到第二行,因为它被视为一个单词,浏览器自然不会中断单词,除非您通过 CSS 使用 或 .你有没有用真实的内容、真实的话语来尝试过?word-breakword-wrap

答:

1赞 user22672978 10/4/2023 #1

使用请参阅此处的示例word-wrap

评论

0赞 Yusuf Khan 10/13/2023
兄弟。你能帮我解决这个问题吗 最近我遇到了 Ckeditor 的 Richtextuploading 字段无法在我的 html 页面中反映块引号