title: Text only carousel
body: <p>I am unable to have a carousel with only text <strong>without any img</strong>. The text seems to be colliding with the controls. Every example I've found uses the <code>&lt;img&gt;</code>. I have tried to use <code>d-flex</code> class, block and even the <code>carousel-caption</code>. Nothing has worked so far.</p>
  
  <pre><code>&lt;div id="carouselContent" class="carousel slide" data-ride="carousel"&gt;
      &lt;div class="carousel-inner" role="listbox"&gt;
          &lt;div class="carousel-item active"&gt;
              &lt;p&gt;lorem ipsum (imagine longer text)&lt;/p&gt;
          &lt;/div&gt;
          &lt;div class="carousel-item"&gt;
              &lt;p&gt;lorem ipsum (imagine longer text)&lt;/p&gt;
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;a class="carousel-control-prev" href="#carouselContent" role="button" data-slide="prev"&gt;
          &lt;span class="carousel-control-prev-icon" aria-hidden="true"&gt;&lt;/span&gt;
          &lt;span class="sr-only"&gt;Previous&lt;/span&gt;
      &lt;/a&gt;
      &lt;a class="carousel-control-next" href="#carouselContent" role="button" data-slide="next"&gt;
          &lt;span class="carousel-control-next-icon" aria-hidden="true"&gt;&lt;/span&gt;
          &lt;span class="sr-only"&gt;Next&lt;/span&gt;
      &lt;/a&gt;
  &lt;/div&gt;
  </code></pre>