background-image url images plaid jpg no-repeat wont show up

Question

I can t seem to make my plaid jpg the background on any of my pages  let alone all of them  I ve tried selecting it by body  html     the specific id of  home   nothing works  The image is 300 x 421 pixels  I don t need it to show up pretty  i just want it to show up  behind everything  how would my css look for this  the plaid jpg picture is in my images folder in the same directory as my index html file  This link is at the top of my index html file  and my stylesheet is in my stylesheets folder named mystyles css    lt link rel  stylesheet  type  text css  href  stylesheets mystyles css  gt    I have tried altering my  CSS file every way imaginable in my opinion  the first 30 google results for  background-image not showing up  and none worked  I m aware it s probably something simple   mystyles css in its most basic form with no selector     background-image  url  images plaid jpg   no-repeat    index html    lt body gt           lt  -- Page  home -- gt               lt div id  home                  data-role  page                  data-title  Home  gt                   lt div data-role  header                      data-position  fixed                      data-theme  b  gt                       lt h1 gt Home lt  h1 gt                       lt a href   info                          data-icon  info                          data-iconpos  notext                          data-rel  dialog                          class  ui-btn-right                           gt Info lt  a gt                   lt  div gt  lt  -- header -- gt                   lt div data-role  content  gt                    lt div data-role  controlgroup  data-theme  e  gt                       lt a href   blog                           data-role  button                          data-icon  arrow-r                           data-theme  e                       gt Blog lt  a gt                       lt a href   videos                           data-role  button                          data-icon  arrow-r                           data-theme  e                       gt Videos lt  a gt                       lt a href   photos                           data-role  button                          data-icon  arrow-r                           data-theme  e                       gt Photos lt  a gt                       lt a href   tweets                           data-role  button                          data-icon  arrow-r                           data-theme  e                       gt Tweets lt  a gt                   lt  div gt  lt  -- links -- gt                   lt  div gt   lt  -- content -- gt               lt  div gt  lt  -- page -- gt    this wasn t succesful  body       background-image  url   images plaid jpg        background-repeat  no-repeat      this is whats in my  also   lt head gt       lt meta charset  utf-8    gt       lt title gt Mob App lt  title gt       lt head gt       lt meta name  viewport  content  width device-width  initial-scale 1  maximum-scale 1    gt        lt link rel  shortcut icon  href  images favicon ico    gt         lt  -- lt link rel  stylesheet  href  http   code jquery com mobile 1 2 0 jquery mobile-1 2 0 min css    gt -- gt       lt script src  http   code jquery com jquery-1 8 2 min js  gt  lt  script gt       lt script src  http   code jquery com mobile 1 2 0 jquery mobile-1 2 0 min js  gt  lt  script gt        lt script src  javascripts myscript js  gt  lt  script gt       lt link rel  stylesheet  type  text css  href  stylesheets mystyles css    gt       lt  head gt

User · Accepted Answer

You either use    background-image  url  images plaid jpg    background-repeat  no-repeat        or  background  transparent url  images plaid jpg   top left no-repeat        but definitively not  background-image  url  images plaid jpg   no-repeat    EDIT   Demo at JSFIDDLE using absolute paths  in case you have troubles referring to your images with relative paths

User · Answer

Most important  Keep in mind that relative URLs are resolved from the URL of your stylesheet   So it will work if folder images is inside the stylesheets folder   From you description you would need to change it to either  url     images plaid jpg     or  url   images plaid jpg        Additional 1  Also you cannot have no selector     CSS is applied through selectors      Additional 2  You should use either the shorthand background to pass multiple values like this  background  url     images plaid jpg   no-repeat    or the verbose syntax of specifying each property on its own  background-image  url     images plaid jpg    background-repeat no-repeat

User · Answer

Try this   body        background url  images plaid jpg   no-repeat fixed center      jsfiddle example  http   jsfiddle net Q9Zfa

User · Answer

You may debug using two ways    Press CTRL U to view page Source   Press CTRL F to find  mystyles css  in source   click on mystyles css link and check if it is not showing  404 not found   You can INSPECT ELEMENT IN FIRBUG and set path to Image  Set Image height and width because sometimes image doesnt show up    Hope this may works

User · Answer

If that really is all that s in your CSS file  then yes  nothing will happen  You need a selector  even if it s as simple as body   body       background-image  url

User · Answer

lt style gt      background  url images Untitled-2 fw png   background-repeat no-repeat  background-position center  background-size  cover       lt  style gt

[jquery] background-image: url("images/plaid.jpg") no-repeat; wont show up

Examples related to jquery

Examples related to css

Examples related to background

Examples related to stylesheet