Question posted in 
I have write the following code to make a have a background image. It’s working on Chrome and Internet Explorer but it’s not shown in firefox.
<style type="text/css">
#profile{
width: 100%;
height: 100px;
background-size: cover;
-webkit-background-size: cover;
-moz-background-size: cover;
background-size: cover;
-o-background-size: cover;
background-image: url(https://pbs.twimg.com/profile_banners/6242932/1483907177/1500x500);
}
</style>
<section id="profile" class="img-responsive">I am using twitter bootstrap, someone can help?
This is when I inspect element in firefox it shows
#profile {
width: 100%;
height: 100px;
Getting a error in this part in blockquote*
background-size: cover;
-webkit-background-size: cover;
-moz-background-size: cover;
background-size: cover;
-o-background-size: cover;
*
background-image: url(“https://pbs.twimg.com/profile_banners/6242932/1483907177/1500×500“);
}
The blockquote part is shown with a line in the text like the tag text deleted
3
Answers
Here is a link to Mozilla Develop Network’s article on background-size property: https://developer.mozilla.org/en-US/docs/Web/CSS/background-size
I’m no expert at this, so I’m sure the resource can better articulate the answer than I can. Here is a note that may help you though:
If the value of this property is not set in a background shorthand property that is applied to the element after the background-size CSS property, the value of this property is then reset to its initial value by the shorthand property.
Perhaps it seems that your value is not taking hold because some property or value still needs to be defined in your code. Sorry if this wasn’t too clear, just trying to point you in the right direction!
-Tyler
I can see in firefox and in another browser also. Just increase size of height from 100px to 500px and width to 1500px or as per your requirement.
Found the solution the problem was adblock blocking the background image