1

I have tried everything, but the image is still not showing up. Using Ubuntu.
I have a folder called Myproject in the html folder. In Myproject I have two folders named Images where I have my images and stylesheets where i have all my CSS files.

This is My CSS code:

.jumbotron{ background: url('../Images/image1.png');}

I have tried all the following codes:

.jumbotron{ background-image: url('../Images/image1.png');}
.jumbotron{
     background-image: url(../Images/image1.png); 
    -webkit-background-size: 100% 100%;
    -moz-background-size: 100% 100%;
    -o-background-size: 100% 100%;
    background-size: 100% 100%;}

Help me with this. Thanks

Zanon
  • 29,231
  • 20
  • 113
  • 126
fakhruddin tahery
  • 89
  • 3
  • 12

4 Answers4

0

Seems to be working fine with the following piece of code on my webpage on local machine. Try to check specificity of your class. Also check whether your image URL is correct.

Make sure that your CSS folder and your Images folder are in same location because your URL will only work in that condition.

.jumbotron{
background-image: url('../ipadvertical.png');
}
Harsh
  • 1,665
  • 1
  • 10
  • 16
  • CSS and Images folder both are in the same directory. – fakhruddin tahery Dec 17 '14 at 10:05
  • Same URL seems to be working fine in my machine. Image is loading properly. Why don't you share your code via JSFiddle or something. Will give broader understanding of your issue. Also check whether image is getting loaded but not showing via your chrome console. – Harsh Dec 17 '14 at 10:15
0

What order are you loading the CSS files in? Make sure that your custom CSS is being loaded after the Bootstrap CSS or it may be overwriting it

Jamie Jones
  • 41
  • 8
0

Ok problem solved!
The problem was assigning Permission to the images in Ubuntu.

fakhruddin tahery
  • 89
  • 3
  • 12
-1
 .jumbotron{ background: url(../Images/image1.png);}

Try this it will work definitely after make sure that CSS is loaded after Bootstrap and make sure your image is present in the provided location.

SAM96
  • 33
  • 6
  • This is the exact same code as in the question, right? – neeh Sep 11 '17 at 21:13
  • not at all (../Images/image1.png) here single quotation has been removed. – SAM96 Sep 11 '17 at 21:23
  • Even I was not getting the background image in Jumbotron, but after removing the quote(') I got the desired result. – SAM96 Sep 11 '17 at 21:26
  • Quotes are optional for CSS url. See [this](https://stackoverflow.com/questions/2168855/is-quoting-the-value-of-url-really-necessary) – neeh Sep 11 '17 at 21:26