[SOLVED] CSS images issue

In my old html layout I had images linked in my css code such as this background image below
body {
font: normal 62.5% Tahoma,sans-serif;
background-image: url(../img/bg_image.png);
background-color: #6c6c6c;
background-repeat: repeat-x;
}
and this header image below
.header {
background: url(../img/logo_hdr.png) no-repeat center top;
height: 358px;
margin-bottom: 5px;
}

when I placed the css file into my template everything comes up except these images. I read that all you have to do is add "../" before the image location but it didn’t work for these images only the other 1 image that was in the css file.

Any help would be great in helping me figure this one out.

Thanks

Background images in .css files are relative to the css file. So if you have a folder with your .css file and an img folder with your images, the path would be img/filename.jpg. If your .css file is in a folder named style, then you would need ../img/filename.jpg.

I tried both ways and you can see in the code that I posted that I now have it with ../img/filename.jpg and it hasn’t worked that is why I posted the question on here since both ways don’t seem to work for me.

Well, without seeing your file structure it’s hard to be any more specific.

Does your template have a <link rel="stylesheet" ... /> tag, or is this css in <style>...</style> tags in the template head?

I have the template setup as such
<link href="assets/templates/amdesigns/styles/master.css"rel="stylesheet" type="text/css"/>

Here is the link http://www.amdesignsstudio.com/modx-1.0.0/

and this is what it should look like http://www.amdesignsstudio.com

Thank you

Ok, so where are the images? assets/templates/amdesigns/images?

assets/templates/amdesigns/img
and the css is in
assets/templates/amdesigns/styles

then

will do the trick. Since the .css file is in amdesigns/styles, you need to go up one (../) into amdesigns, then back down into the img folder to get the image file.

That is exactly what I thought it would be as well but it doesn’t work. That is the way I have it now
body {
font: normal 62.5% Tahoma,sans-serif;
background-image: url(../img/bg_image.png);
background-color: #6c6c6c;
background-repeat: repeat-x;
}

I see in the source of the page this:

<base href="[(site_url["/>

which should be:

<base href="[(site_url)] "/>

Change that and see if it helps