Kryptronic Software Support Forum

You are viewing this forum as a guest. Login to an existing account, or create a new account, to reply to topics and to create new topics.

#1 10-31-2012 08:42:30

KiD91
Member
Registered: 04-03-2012
Posts: 144

Coloured Bullet Points

Hi

Can someone advise how to change the colour of bullet points form black to red?

Thank you

Jane

Offline

 

#2 10-31-2012 09:35:06

nigel
Member
From: Peterborough, UK
Registered: 04-27-2008
Posts: 413
Website

Re: Coloured Bullet Points

Hi Jane,

I'm not sure if you can use css to change the colour of the point without it changing the colour of the text but you could use an image instead.

list-style-image: url("../media/red-dot.gif");

Nigel

Offline

 

#3 10-31-2012 10:01:03

KiD91
Member
Registered: 04-03-2012
Posts: 144

Re: Coloured Bullet Points

Hi Nigel

Thank you for coming back to me, I have tried something similar using info gained from the W3schools website, without success, which means I am obviously doing something wrong!

list-style-image: url("../media/red-dot.gif");

just to clarify what do i put in place of the 'url' and is there any other folders  i need to put before "media'

Thanks and regards

Jane

Offline

 

#4 10-31-2012 10:03:34

KiD91
Member
Registered: 04-03-2012
Posts: 144

Re: Coloured Bullet Points

Hi Nigel

Just had a thought, where would this expression/string be placed?

-In the description editor of a category

or

-In the Css directory?

Thanks you

Jane

Offline

 

#5 10-31-2012 10:07:58

nigel
Member
From: Peterborough, UK
Registered: 04-27-2008
Posts: 413
Website

Re: Coloured Bullet Points

Hi,

look through your css file and see how other image links are generated, it might be slightly different to the example I gave. Then upload the image to the appropriate folder.

Do you have a link to the page where you want the bullets?

Nigel

Offline

 

#6 10-31-2012 10:29:26

KiD91
Member
Registered: 04-03-2012
Posts: 144

Re: Coloured Bullet Points

Hi Nigel

Please find link as follows

http://www.kidcatering.com/ecom-catshow … n-hob.html

Thanks and regards

Jane

Offline

 

#7 10-31-2012 10:41:09

nigel
Member
From: Peterborough, UK
Registered: 04-27-2008
Posts: 413
Website

Re: Coloured Bullet Points

Hi Jane,

this should make it look a bit neater. You can obviously change the padding etc. as required.

ul
{
list-style-image: url("../media/red-bullet-point.gif");
padding-left:20px;
margin:0px;
}

ul li
{

padding:0px;
}


Nigel

Offline

 

#8 10-31-2012 10:52:01

KiD91
Member
Registered: 04-03-2012
Posts: 144

Re: Coloured Bullet Points

Hi Nigel

Not to sound dim but where will i place this expression string?

Thanks and regards

Jane

Offline

 

#9 10-31-2012 11:26:54

nigel
Member
From: Peterborough, UK
Registered: 04-27-2008
Posts: 413
Website

Re: Coloured Bullet Points

Hi Jane,

skins/kidcater/css/all.css


Nigel

Offline

 

#10 10-31-2012 11:38:54

nigel
Member
From: Peterborough, UK
Registered: 04-27-2008
Posts: 413
Website

Re: Coloured Bullet Points

Hi Jane,

in your all.css file look for:

td.cptbl_cat
{
  padding-top: 5px;
  padding-right: 0px;
  padding-bottom: 0px;
  padding-left: 0px;
  vertical-align: top;
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-bottom-color: #dedede;
}

then underneath it add:


td.cptbl_cat UL {

list-style-image: url("../media/red-bullet-point.gif");
padding-left:20px;
margin:0px;
}

Nigel

Offline

 

#11 10-31-2012 12:09:28

KiD91
Member
Registered: 04-03-2012
Posts: 144

Re: Coloured Bullet Points

Hi Nigel

Thank you very much for your help, very much appreciated, I am learning as I go, I knew I was frustratingly close to resolving it and that I was missing the vital ingredient.

I had looked in the Css file, but sadly I wasn't sure as to what I was looking for, I'd seen the table formulas and I had dismissed them as being irrelevant as I was thinking lists not tables, so thank you!

Can this formula be adapted for a product description?

Thanks and regards

Jane

Offline

 

#12 10-31-2012 12:27:57

KiD91
Member
Registered: 04-03-2012
Posts: 144

Re: Coloured Bullet Points

Hi Nigel

It doesn't appear to work, this is what is in my css file

table.cptbl_cat {
     margin: 0px 0px 10px 0px;
     border-spacing: 0px;
     border-collapse: collapse;
     width: 100%;
     }

td.cptbl_cat {
     padding: 5px 0px 0px 0px;
     vertical-align: top;
     border-bottom: 1px solid #DEDEDE;
     }
td.cptbl_cat UL {
list-style-image: url("../media/red-bullet-point.gif");
padding-left20px;
margin:0px;
}
td.cptbl_cat a {
     font-weight: bold;
     }

td.cptbl_cat_blank {
     display: none;
     }

Regards

Jane

Offline

 

#13 10-31-2012 14:12:47

zanart
Member
From: bedford
Registered: 04-02-2008
Posts: 1679

Re: Coloured Bullet Points

Code:

td.cptbl_cat UL {
list-style-image: url("../media/red-bullet-point.gif");
padding-left20px;
margin:0px;
}

isn;t in your all.css file here:

http://www.kidcatering.com/ecom-catshow … ss/all.css

in addition you have entered css style that are not wrapped in style tags:

Code:

<meta name="description" content="Modular Units




ul
{
list-style-type:none;
padding:3px;
margin:0px;
}
ul li
{
background-image:url("../media/red-bullet-point.gif");
background-repeat:no-repeat;
background-position:-1 px -1px; 
padding-left:14px;
}



 
These Stylish, Space Saving induction hobs are ideal for kitchens, front of house situations and outside catering
Induction Hobs are energy saving thanks to heating efficiency and no need to heat up
No flame means safe operation and pots stay cleaner
Extremely easy to use and to clean
Graduated digital controls
Only uses electricity when the pan is on the hob
The hobs can be lined up to create a modular cooking suite





" />
<meta name="robots" content="index,follow" />

- Euorpacart 8

Offline

 

#14 11-01-2012 06:22:20

KiD91
Member
Registered: 04-03-2012
Posts: 144

Re: Coloured Bullet Points

Thank you, for this Zenart, will check it out

Offline

 

Board footer