title: Set Image To 100% Width - Bootstrap
body: <p>Using Bootstrap v5, I want to make a header that spans the entire width of the container. I've combed the site but none of the solutions work for me.</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>*{
        box-sizing: border-box;
        font-size: 16px;
      }
      
      .no-padding {
        padding-left: 0;
        padding-right: 0;
      }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>    &lt;header&gt;
        &lt;div class="container-fluid no-padding"&gt;
          &lt;img 
          src="https://images.unsplash.com/photo-1536782376847-5c9d14d97cc0? ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&amp;ixlib=rb-1.2.1&amp;auto=format&amp;fit=crop&amp;w=1356&amp;q=80" 
          class="img-fluid" 
          alt="..."&gt;
        &lt;/div&gt;
      &lt;/header&gt;
  
      </code></pre>
  </div>
  </div>
  </p>