title: Trying to justify-content-between inside an unordered list (UL), but it doesnt seems to be working
body: <p>I am trying to create a list in bootstrap. It seems that justify-content-between is not working here. What am I doing wrong? (I want the $ aligned to the right)</p>
  <pre><code>&lt;div class=&quot;row&quot;&gt;
     &lt;div class=&quot;col-md-6&quot;&gt;
  
          &lt;div class = &quot;text-info&quot;&gt; 
               &lt;h5&gt; Cambios &lt;/h5&gt;
          &lt;/div&gt;
       &lt;ul class=&quot;list-group&quot;&gt;
            {% for c in cambios%}
                 &lt;li class=&quot;list-group-item d-flex justify-content-between&quot;&gt;
                       &lt;div&gt;
                           &lt;h6 class=&quot;my-0&quot;&gt;{{c['cantidad']}} &amp;nbsp; {{c['producto']}}&lt;/h6&gt;
                           &lt;small class=&quot;text-muted&quot;&gt; X &amp;nbsp; {{c['cambio_por']}}&lt;/small&gt; 
                        &lt;/div&gt;    
                        &lt;span &gt;{{ &quot;${:,.0f}&quot;.format(c['diferencia']) }}/span&gt;
                        &lt;br&gt;
                  &lt;/li&gt;
             {% endfor %}
        &lt;/ul&gt;
      &lt;/div&gt;
  
      &lt;div class=&quot;col-md-6&quot;&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  
  </code></pre>
  <p><a href="https://i.stack.imgur.com/6MH6x.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/6MH6x.png" alt="enter image description here" /></a></p>