0

I have to mask the card image with transparent blue colour background. code:

<div class="card bg-dark text-white">
  <img class="card-img" src="..." alt="Card image">
  <div class="card-img-overlay">
    <h5 class="card-title">Card title</h5>
    <p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
    <p class="card-text">Last updated 3 mins ago</p>
  </div>
</div>
Vin
  • 3
  • 3
  • Without the rest of the code its a guess but I'm guessing `.card-img-overlay` is already overlaying `.card-img` so just add `background-color: rgba(137, 196, 244, .4)` to `.card-img-overlay` – Nico Shultz Feb 16 '21 at 15:20
  • Does this answer your question? [How to make in CSS an overlay over an image?](https://stackoverflow.com/questions/21086385/how-to-make-in-css-an-overlay-over-an-image) – Germano Plebani Feb 16 '21 at 15:53

0 Answers0