CODEWITHSUNDEEP
htmlcssgoogle-chromemozilla
Praful Bagai
Praful Bagai

Reputation: 17382

Background shows in Mozilla but not in chrome

I've applied a background to a div. it shows in mozilla but not in chrome.

Here is my code

#product-header {
    background: -moz-linear-gradient(-70deg, #578EA3, #34495E) repeat scroll 0 0 rgba(0, 0, 0, 0);
    color: #FFFFFF;
    padding-bottom: 9px;
    padding-top: 10px;
    text-align: center;
}

Where I'm going wrong?

Upvotes: 0

Views: 105

Answers (1)

Ernest Nowacki
Ernest Nowacki

Reputation: 241

You've used background property which is explicit for mozilla only. You should add one suitable for chrome:

-webkit-linear-gradient(-70deg, #578EA3, #34495E) repeat scroll 0 0 rgba(0, 0, 0, 0);

You could also use plain linear-gradient like:

linear-gradient(-70deg, #578EA3, #34495E) repeat scroll 0 0 rgba(0, 0, 0, 0);

Putting it allthogether:

#product-header {
    background: -moz-linear-gradient(-70deg, #578EA3, #34495E) repeat scroll 0 0 rgba(0, 0, 0, 0);
    background: -webkit-linear-gradient(-70deg, #578EA3, #34495E) repeat scroll 0 0 rgba(0, 0, 0, 0);
    background: linear-gradient(-70deg, #578EA3, #34495E) repeat scroll 0 0 rgba(0, 0, 0, 0);
    color: #FFFFFF;
    padding-bottom: 9px;
    padding-top: 10px;
    text-align: center;
}

Upvotes: 1

Related Questions