image link broken??

[gottelicious]

Hi i am almost finished installing my cms website but am having trouble with parts of my css. My stylesheet is located on my server in the directory var/www/cmsmadesimple/css. Now i know that i link to it properly from my template cause the layout of the site looks like it should, but it does not show the images. My images are located at var/www/cmsmadesimple/uploads/images, and i link to them in my stylesheet as following:
#header-container h1 span {position:absolute; top:0; left:0; z-index:1; display:block; width:266px; height:40px; background:url(/uploads/images/banner.png) no-repeat 0 0;}

i have tried using url(../uploads/images/banner.png) but it still doesn't work. How can i properly link to the images??

Thanks

Anders Gotfredsen

[Wishbone]

The absolute path, /uploads/images/banner.png, should work. What happens when you navigate to yourdomain.com/uploads/images/banner.png ?? If this is online, post the URL and we can help.

Why do you have your stylesheets in a directory instead of managing them with CMSMS?

[gottelicious]

my url is www.norcor.dk/cmsmadesimple. I started out with my stylesheets just in cmsms, but i had trouble getting them to work at all, and i was suggested to move them there. Anyway i have created a new stylesheet in cmsms identical to the other one and tied it to the appropriate templates instead of the other one, but it still doesn't work. if i navigate to uploads/images/banner.png i see the picture just fine. My stylesheet looks like this:

/* ----------------- reset */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td
{margin:0; padding:0; border:0; outline:0; font-weight:inherit; font-style:inherit; font-family:inherit; vertical-align:baseline;}
img {vertical-align: bottom;}
:focus {outline: 0;}
ol, ul {list-style:none;}
strong {font-weight:bold;}
em {font-style:italic;}

/* ----------------- layout */
html {height:100%; margin-bottom:1px; overflow-y:scroll;}
body {background:#181515}
#container {position:relative;}
#header {position:relative; background:#000 url(/uploads/norcornex/bg-top.gif) repeat-x top;}
#header-container {position:relative; width:900px; height:165px; margin:0 auto; padding:0; background:url(/uploads/images/banner.png) no-repeat 298px -60px;}
#content {position:relative; background:#f3f2f2;}
#content-container {width:900px; margin:0 auto; padding:0; overflow:hidden;}
#wrap {float:left; width:550px; padding:24px 0 20px 30px; margin-bottom:6px; overflow:hidden;}
#top {margin:0; background:#f3f2f2;}
#center {float:right; width:260px; margin:0; padding:0px; background:#f3f2f2;}
#left {float:left; width:260px; padding:0px; margin-bottom:6px; background:#f3f2f2;}
#right {float:right; width:262px; padding:24px 30px 20px 0; min-height:360px; background:#f3f2f2;}
#footer {position:relative; background:#181515}
#footer-container {width:920px; height:80px; margin:0 auto; padding:6px 0 0 0; text-align:center;}

/* ----------------- logo */
#header-container h1 {position:absolute; top:37px; left:22px; width:266px; height:40px; padding:0; font-weight:normal; text-align:center; overflow:hidden;}
#header-container h1 span {position:absolute; top:0; left:0; z-index:1; display:block; width:266px; height:40px; background:url(/uploads/images/banner.png) no-repeat 0 0;}
#header-container h1 {font-size:36px; line-height:36px;}
#header-container h1 a:link, #header-container h1 a:visited {text-decoration:none; color:#b0a798;}
#header-container h1 a:hover {color:#cdc6ba;}
#header-container h2 {position:absolute; top:77px; left:22px; width:266px; height:20px; padding:0; font-weight:normal; text-align:center; overflow:hidden;}
#header-container h2 span {position:absolute; top:0; left:0; z-index:1; display:block; width:266px; height:20px; background:url(/uploads/images/banner.png) no-repeat 0 -40px;}
#header-container h2 {font-size:15px; line-height:15px;}
#header-container h2 a:link, #header-container h2 a:visited {text-decoration:none; color:#b0a798;}
#header-container h2 a:hover {color:#cdc6ba;}

/* ----------------- topmenu */
#topmenu {position:absolute; left:0; top:139px; width:870px; height:25px; padding:0 0 0 30px;}

/* ----------------- text-format */
body {font-family:arial, sans-serif; font-size:12px; line-height:18px; color:#333;}
h1, h2 {font-family:'arial black', arial, sans-serif; font-size:12px; line-height:27px; padding-top:9px; text-transform:uppercase; background:url(/uploads/norcornex/line.gif)repeat-x bottom;}
h3 {font-size:12px; font-weight:bold}
p {padding:0 0 18px 0;}

/* ----------------- text links */
a:link, a:visited {text-decoration:none; color:#ff9933;}
a:focus {outline:none; text-decoration:underline;}
a:hover{text-decoration:underline;}

/* ----------------- links */
a:link, a:visited {text-decoration:none; color:#993; }
a:focus {outline:none; text-decoration:underline}
a:hover {color:#993; text-decoration:underline}

/* ----------------- footer */
#footer p {display:inline; font-size:11px; margin:0; font-weight:bold; color:#c0b8b1;}
#footer span.marker {display:inline-block; padding:0 1px; color:#c0b8b1;}
#footer p a {color:#ffff99;}

/*----------------------------- topmenu */
#topmenu ul {height:25px; font-size:11px; line-height:11px; font-weight:bold; text-transform:uppercase;}
#topmenu li {float:left;}
#topmenu a:link, #topmenu a:visited {display:inline-block; padding:8px 15px; margin:0; text-decoration:none; color:#c0b8b1;}
#topmenu li a:focus {color:#fff; outline:none; text-decoration:underline;}
#topmenu li a:hover {color:#fff;}
#topmenu li.currentpage {padding:8px 15px; margin:0; text-decoration:none; color:#ffff99;}

/* ----------------- ie hacks */
* html body{text-align:center;}
* html #container{text-align:left;}
* html #right {height:360px;}
* html #topmenu {display:inline;}

/* ----------------- accessability */
span.accesskey {text-decoration:none;}
.accessibility, hr {position:absolute; top:-999em; left:-999em;}
dfn {position:absolute; left:-1000px; top:-1000px; width:0; height:0; overflow:hidden; display:inline;}

/* ----------------- mhl adds */
dd {margin-left: 1em;
l}

ul {list-style: disc;
list-style-position: inside;}

Thanks a lot for helping me and please let me know if i omitted any useful information.

[Wishbone]

please no dead/unreal links...

How do you suggest I post an example? Now he can't see what the answer is.



Anyways, the issue lies with the fact that you are in a subdirectory (cmsmadesimple).. /uploads/norcornex/bg-top.gif refers to http://www.norcor.dk/uploads/norcornex/bg-top.gif .. not http://www.norcor.dk/cmsmadesimple/uplo ... bg-top.gif

You can give it the full URL... In {cms_stylesheet} you can use:

background-image: url([[root_url]]/uploads/norcornex/bg-top.gif)

..and it will calculate it for you.