CODEWITHSUNDEEP
css
Pumizo
Pumizo

Reputation: 283

PNG transparency in CSS

I need to add transparency to the PNG that I'm using as background. How can I add transparency?

section#testimonials {
    height:  647px;
    background: url("../img/yellow_testimonial.png") repeat-x 0 0;
    padding: 0;
    color: #e4e5e2;
    z-index: 500;
    box-shadow: 0 0 16px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 0 0 16px rgba(0, 0, 0, 0.3);
    -webkit-box-shadow: 0 0 16px rgba(0, 0, 0, 0.3);
}

Upvotes: 1

Views: 18204

Answers (1)

Alber Developer
Alber Developer

Reputation: 98

by default, if you has been saved correctly the .png file you should not have that problem. I see that in your css style don't have a background color defined.

Try this: 

section#testimonials {
    height:  647px;
    background: url("../img/yellow_testimonial.png") repeat-x 0 0 #0099FF;
    padding: 0;
    color: #e4e5e2;
    z-index: 500;
    box-shadow: 0 0 16px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 0 0 16px rgba(0, 0, 0, 0.3);
    -webkit-box-shadow: 0 0 16px rgba(0, 0, 0, 0.3);
}

This is one option, another way that you can try is applying an rgba code, like this: rgba(200, 54, 54, 0.5) on parent div background style.

I hope you find it helpful.

Upvotes: 1

Related Questions