Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS All images not showing up

  • This topic is empty.
Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #28698
    akosironi
    Participant

    hi chris,

    im currently working on a new wordpress site and have recently viewed and learned alot from your screencast’s 25-27, i was able to do my mock up pretty well, tested my images and div layouts on an htm file. css worked fine, but then when i copied and pasted my css file over to the themes folder and my images file to the wp-content/themes/…images folder all images are not showing up, i added borders around my divs to check and the borders show up meaning it reads my css file right? tried the following codes already but still no luck.

    Code:
    #hometopbg { border: 1px solid #FF80FF; background: #000000 url(images/hometopbg.jpg) }
    #hometopbg { border: 1px solid #FF80FF; background: #000000 url(‘images/hometopbg.jpg’) }
    #hometopbg { border: 1px solid #FF80FF; background: #000000 url(“images/hometopbg.jpg”) }
    #hometopbg { border: 1px solid #FF80FF; background: #000000 url(/images/hometopbg.jpg) }
    #hometopbg { border: 1px solid #FF80FF; background: #000000 url(‘/images/hometopbg.jpg’) }
    #hometopbg { border: 1px solid #FF80FF; background: #000000 url(“/images/hometopbg.jpg”) }

    what could possibly be wrong here?
    btw im editing starkers theme 2.2

    thanks in advance :)

    #73841

    You are right, your html file reads the css but unable to display the images. Thats because in css, you can’t have more than one id (#hometopbg) with the same name. If you use in that case the file will read the last line i.e line marked bold.

    #hometopbg { border: 1px solid #FF80FF; background: #000000 url(images/hometopbg.jpg) }
    #hometopbg { border: 1px solid #FF80FF; background: #000000 url(‘images/hometopbg.jpg’) }
    #hometopbg { border: 1px solid #FF80FF; background: #000000 url("images/hometopbg.jpg") }
    #hometopbg { border: 1px solid #FF80FF; background: #000000 url(/images/hometopbg.jpg) }
    #hometopbg { border: 1px solid #FF80FF; background: #000000 url(‘/images/hometopbg.jpg’) }
    #hometopbg { border: 1px solid #FF80FF; background: #000000 url("/images/hometopbg.jpg") }

    As your file reads the last line, lets get into this and remove the slash from image url. So the final line will be:
    #hometopbg { border: 1px solid #FF80FF; background: #000000 url(‘images/hometopbg.jpg’) }

    Test it and see the result.
    Cheers!!! :)

Viewing 2 posts - 1 through 2 (of 2 total)
  • You must be logged in to reply to this topic.