X-Cart forums - Setting images within CSS

X-Cart forums (https://forum.x-cart.com/index.php)

- Changing design (https://forum.x-cart.com/forumdisplay.php?f=51)

- - Setting images within CSS (https://forum.x-cart.com/showthread.php?t=762)

Hyperdelicious

11-24-2002 10:16 AM

Setting images within CSS

===============================================

How do you set images in CSS... for instance I created a gif for bulleted
lists and I would like to use CSS to replace the bullet with the gif...

Code:

LI {

        list-style-image : url({$ImagesDir}/li_bullet.gif);

        vertical-align : middle;

        color : #40445E;

        font-weight : bold;

}

However this does not appear to work with x-cart... I'm thinking it has
something to do with these{ }... any ideas?

--------------------------------------------------------THANKS-------------------

:) HYPERDELICIOUS
===============================================
===============================================

tmx	11-24-2002 10:57 AM

...

Are you putting it into the tpl your using it in or did you put it in the CSS file that x-cart already has? If your using it in the tpl you could also try putting {literl} {/literal} in the beginning and end.

Hyperdelicious

11-24-2002 11:04 AM

Editing skin1.css

===============================================

I placed the following code into skin1.css... therefore I am editing the
Style Sheet x-cart came with...

Code:

LI { 

   list-style-image : url({$ImagesDir}/li_bullet.gif); 

   vertical-align : middle; 

   color : #40445E; 

   font-weight : bold; 

}

any ideas... how to get this to work?

--------------------------------------------------------THANKS-------------------

:?HYPERDELICIOUS
===============================================
===============================================

shan	11-24-2002 11:14 AM

I would imagine that you would have to use the full url to the bullet image.

Quote:

LI {
list-style-image : url(http://www.yoursite.com/xcart/skin1/images/li_bullet.gif);
vertical-align : middle;
color : #40445E;
font-weight : bold;
}

See if that works

tmx	11-24-2002 11:16 AM

...

Try this, Put this into your CSS File...

Code:

ul { list-style-image: url("li_bullet.gif"); }

And then to list set it up like so...

Code:

<ul>[*]Your text[/list]

Hyperdelicious

11-24-2002 11:32 AM

Thanks

===============================================

Thanks Shan, I had tried the absolute URL and it did not work... but
checking your code against mine I realized I forgot a '/ ' :oops: ... my
code actually looked like this...

Code:

http://www.mysite.com/xcart/skin1/imagesil_bullet.gif

Human error... anyway do you think it will screw with the SSL key since
the image is being pulled from http:// rather than https://? If so do you
think I should change the URL of the image to https://?

-------------------------------------------------------THANKS--------------------

:) HYPERDELICIOUS
===============================================
===============================================

shan	11-24-2002 12:45 PM

yeh, just set it from hte https sever and it will be fine for both then

Hyperdelicious

11-24-2002 12:51 PM

Thanks

===============================================

Thanks again Shan... I appreciate your help/advice.

--------------------------------------------------------------THANKS-------------

:) HYPERDELICIOUS
===============================================
===============================================
[/b]

funkydunk

11-28-2002 10:34 PM

If you set the url as relative to the skin1.css file this will work.

ie.

LI {
list-style-image : url(images/li_bullet.gif);
vertical-align : middle;
color : #40445E;
font-weight : bold;
}

All times are GMT -8. The time now is 01:12 PM.