How do you specifiy the subfolder "background-image: url(" path if the CSS, HTML and images are in different folders?

Posted on 2007-10-21
Last Modified: 2010-05-18
Seems lke a doofus question but...
Assuming the folder structure:
HtmlRoot = HTML file location
HtmlRoot/Images = Image location
HtmlRoot/Styles = CSS file location

The HTML file finds and loads the CSS using the syntax:  link href="Styles/t1Body.css"
The HTML finds and loads images using the syntax src="images/SMLLOGO.jpg"

But I can not find the proper CSS syntax which instructs the HTML to look in the Images folder for a background image  -- UNLESS both CSS and image file are in HtmlRoot.
I've tried: background-image: url("/Images/back.gif")
background-image: url("~/Images/back.gif")
and I'm not sure what else.

Any thoughts?
Thank you.

Question by:RichardKline
    LVL 30

    Accepted Solution

    have you tried

    background-image: url(/Images/back.gif)


    background-image: url(../Images/back.gif)

    you don't need double or single quotes in the path for background in CSS.
    LVL 1

    Author Comment

    Both work when launching IE from inside the VS2008 IDE....  Only the ../images/back.gif works when FireFox/IE are independently launched.  

    I would've throught  that /images/back.gif would've worked but...

    LVL 4

    Expert Comment

    Try giving full URL of the image file, like.....
    background-image: url(

    Good Luck

    Write Comment

    Please enter a first name

    Please enter a last name

    We will never share this with anyone.

    Featured Post

    How your wiki can always stay up-to-date

    Quip doubles as a “living” wiki and a project management tool that evolves with your organization. As you finish projects in Quip, the work remains, easily accessible to all team members, new and old.
    - Increase transparency
    - Onboard new hires faster
    - Access from mobile/offline

    This is a PowerShell web interface I use to manage some task as a network administrator. Clicking an action button on the left frame will display a form in the middle frame to input some data in textboxes, process this data in PowerShell and display…
    Not sure what the best email signature size is? Are you worried about email signature image size? Follow this best practice guide.
    In this tutorial viewers will learn how to embed custom externally-hosted Google Fonts using the Google Font API in CSS Go to the Google Fonts website at Browse or search based on font properties or name to find a suitable font for…
    The viewer will learn how to dynamically set the form action using jQuery.

    758 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    10 Experts available now in Live!

    Get 1:1 Help Now