Twitter bootstrap glyph icons are not loading

Question

This is such a dumb issue, but here we go anyway. Here is my basic structure

/Content/twitter/bootstrap.css
/img/glyphicons-halflings.png

So Content and img are both in my root directory, so to referent the glyph image from my bootstrap.css file I have it like this:

background-image: url("../../img/glyphicons-halflings.png");

Y U NO SHOW?

Is there a .js file I need to check to make sure it is looking in the right directory??

oh and here is a snippet of where I am trying to get the image to render:

 <td>
                @if (item.Something == true)
                {
                    <i class="icon-ok"></i>
                }
                else
                {
                    <i class="icon-remove"></i>
                }
            </td>

UPDATE

There's been a lot of views of this question, so I thought I would share my two cents on it. One note, since posting the question BS 3.0 is now out, so it is possible the structure is different and/or irrelevant, have not looked at it yet. But if you got here, keep in mind this is pre-3.0 Bootstrap.

One thing I have started doing that makes it so I do not really have to mess with anything is bring the entire bootstrap folder into the project, rather than just the css/js/img folders. I typically put it in my root scripts folders with a structure like this:

/scripts
     /libs
          /boostrap <-- the unzipped folder you get when downloading
              /js
              /css
              /img

This may break some conventions since a 'scripts' folder should really just hold scripts. I justify it since I use the scripts folder for scripts (surprise!) and third party libraries (thus the libs folder). Most third party components you get have at least js and css files with them, and I just got too lazy to can them manually separated since some libraries (like bootstrap) rely on where the other files are.

Anyway, my two cents, take a look at the answers below if you want to alter the file locations. All great tips, thanks SO folks!

Answer 1

Your current code should technically work and there is no need of any js file..

background-image: url("../../img/glyphicons-halflings.png"); is perfectly fine for a directory structure like

/Content/twitter/bootstrap.css
/img/glyphicons-halflings.png

You may try this code below to ensure that things are fine..

<td><i class="icon-ok"></i></td>

If this also fails then double check that glyphicons-halflings.png exists at your said path alongwith sufficient privileges..