title: Output a paragraph with line breaks in Django inside a list item
body: <p>I have a bulletin board on a Django website. A single bulletin body is defined as <code>bulletin_body = models.TextField('Body', max_length=5000)</code> in class <code>Bulletin</code> inside <code>models.py</code>. </p>
  
  <p>When a bulletin body is placed in a template as a separate paragraph, it displays all the line breaks that the body contains as expected. That is, <code>&lt;h2&gt;{{bulletin.bulletin_body|linebreaksbr}}&lt;/h2&gt;</code> works fine.</p>
  
  <p>But when a bulletin body is a list element, (e.g. in a page that contains bulletin feed) no line breaks are displayed. Example:</p>
  
  <pre><code>&lt;ul&gt;
      {% for bulletin in latest_bulletin_list %}
          &lt;li&gt;{{bulletin.bulletin_body|linebreaksbr}}&lt;/li&gt;
      {% endfor %}
  &lt;/ul&gt;
  </code></pre>
  
  <p>I've only found answers suggesting to check if the model is <code>TextField</code> and to use <code>linebreaks</code> or <code>linebreaksbr</code> tag. I follow both advice and still can't display line breaks.</p>
  
  <p><strong>Edit:</strong></p>
  
  <p>Here are all tags around the list item:</p>
  
  <pre><code>&lt;body&gt;
      &lt;div class="main_container"&gt;
          &lt;div class="row"&gt;
              &lt;div class="column right"&gt;
                  &lt;div class="bulletin_wrapper"&gt;
                      {% if latest_bulletin_list %}
                          &lt;ul&gt;
                              {% for bulletin in latest_bulletin_list %}
                                          &lt;li&gt;&lt;h2&gt;{{bulletin.bulletin_body|linebreaksbr}}&lt;/h2&gt;&lt;/li&gt;
                              {% endfor %}
                          &lt;/ul&gt;
                      {% else %}
                          &lt;p&gt;No bulletins are available.&lt;/p&gt;
                      {% endif %}
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p>CSS definitions for classes:</p>
  
  <p><code>main_container</code> and <code>body</code> don't have any definition as of now.</p>
  
  <pre><code>.row {
      margin:auto;
  }
  
  /* Clear floats after the columns */
  .row:after {
      content: "";
      display: table;
      clear: both;
  }
  
  .column {
      float: left;
      padding: 10px;
  }
  
  .right {
      width: 40%;
   }
  
  .bulletin_wrapper {
      text-align: left;
      margin-top: 10px;
      width: 95%;
  }
  
  
  ul {
      list-style-type: none;
      margin: 0;
      padding: 0;
      font-size: 12px;
  }
  
  ul a {
      color: #00e040;
      font-weight: 600;
  }
  
  ul a:hover {
      color:#00e040;
  }
  </code></pre>