Пустой тег <p>вставляется автоматически, как мне от него избавиться?

Question

Пустой тег <p></p> вставляется автоматически при отображении страницы, я не уверен, как от него избавиться. Который добавляет ненужное место на веб-странице.

tag in question being highlighted">

Я не уверен, как я могу от него избавиться. Я пытаюсь установить нижнее поле для <p> равным 0px, даже если оно не применяется.

Я был бы очень благодарен всем, кто может помочь мне решить эту проблему.

Заранее спасибо!

Вот код, который отображает блок HTML: тег <p></p> генерируется динамически, но не уверен, как он генерируется из кода.

{% if job_detail.type != '' and job_detail.type is not None or job_detail.age_limit != '' and job_detail.age_limit is not None %}
     <hr />
     <div class="row">
     {% if job_detail.type != '' and job_detail.type is not None %}
       <div class="col-md-6">
         <h3 class="card-title topic-title">JOB TYPE</h3>
         <p class="card-text topic-text last-child">{{ job_detail.type|linebreaks }}</p>
       </div>
     {% endif %}
     {% if job_detail.age_limit != '' and job_detail.age_limit is not None %}
       <div class="col-md-6 mt-4 mt-sm-4 mt-md-0">
         <h3 class="card-title topic-title">AGE LIMIT</h3>
         <p class="card-text topic-text last-child">{{ job_detail.age_limit|linebreaks }}</p>
       </div>
     {% endif %}
     </div>
   {% endif %}

Answer 1

@ Шахзан, добро пожаловать, обычно это лучший способ удалить p-тег, потому что вам это не нужно. Если вы включили bootstrap на своей веб-странице, вы можете использовать css -классы, такие как "pb-2", чтобы исправить отступы внизу.

Я думаю, что ваш инструмент генерирует p-тег. Может быть, вы можете больше рассказать о вашей настройке.

Также вам следует использовать лучшую IDE, возможно, PHPStorm, Atom или Sublime.

<div class="pb-2"></div>

Answer 2

Мне удалось решить эту проблему, добавив следующий стиль к тегу абзаца `` `margin-bottom: 0! Важный

Спасибо всем за ваше время и помощь!

Answer 3

Вы можете назначить «display: none;» к этому пустому автоматически сгенерированному пустому тегу p. Я хотел бы рекомендовать добавить родительский элемент класса (.col-md-6) дочернего элемента ".card-title", а затем использовать псевдоэлемент p: last-child, чтобы сделать его "display: none". Это решит вашу проблему. Я написал фрагмент для вас, чтобы вы лучше поняли этот подход, но когда вы попытаетесь реализовать его, добавьте класс, как указано выше. Для справки добавьте приведенный ниже фрагмент в разделе заголовка вашего проекта:

<style type="text/css">
    .card.mt-2 .card-body.pt-3.pb-3 > .row > .col-md-6 p:last-child {
        display:none;
      }
 </style>