How to make background image fit to full width div in materialize CSS

user_6581669 0
Viewed 138

trying to make background image to cover whole div in materialize CSS, but after many changes, can't understand why is not doing it.

If i add a solid background, works great, but adding url image and fit size to cover, can't make it work.

My code works in css, not is inside a container or row..

.whatWeDo{
background:url("https://media-exp1.licdn.com/dms/image/C561BAQEe01Ads5I8Mg/company-background_10000/0/1579701573454?e=2159024400&v=beta&t=TSO-iYlwaBA5aoAI3KLAJejMasD77_sYSqP0wQviok0") no-repeat center center scroll;
    background-size:cover;
    height: 500px;
   }
<div class="whatWeDo ">
   
</div>

Thank you in advance

materialize css
1 Answers

Your picture size is 1128 * 191px, And you gave your div a height of 500px, and use background-size: cover for it. When you do this. It zooms in on the image so that it eventually covers the entire div. So, we suggest you consider an image with the right size for this.

user_150529010
Related