Zen Cart Logo
Forums / Templates, Stylesheets, Page Layout / How Can I Create the Category list to look like this?

How Can I Create the Category list to look like this?

Locked

Views: 1,781

Results 1 to 7 of 7
This thread is locked. New replies are disabled.
2 Jul 2006, 5:29 PM
#1
robert_t avatar

robert_t

New Zenner

Join Date:
Aug 2005
Posts:
50
Plugin Contributions:
0

How Can I Create the Category list to look like this?

This is a sample of an idea I would like to copy.
I need to know what to edit to get the lines between the categories like this. It can't be something that is added to the top of bottom of an item because the lines are only in between the Categories and not on top and bottom.

Also I like the bullets and would like to be able to add bullets and if possible to have nt only the Category name as a link but to have the whole table cell containing the category name as a link.

2 Jul 2006, 6:23 PM
#2
kuroi avatar

kuroi

Totally Zenned

Join Date:
Apr 2006
Location:
London, UK
Posts:
10,475
Plugin Contributions:
11

Re: How Can I Create the Category list to look like this?

The answer is probably CSS, but we would need to see what you are talking about to be sure.

2 Jul 2006, 6:52 PM
#3
robert_t avatar

robert_t

New Zenner

Join Date:
Aug 2005
Posts:
50
Plugin Contributions:
0

Re: How Can I Create the Category list to look like this?

Sorry, I forgot to attach the image.

Here it is.

2 Jul 2006, 7:02 PM
#4
kuroi avatar

kuroi

Totally Zenned

Join Date:
Apr 2006
Location:
London, UK
Posts:
10,475
Plugin Contributions:
11

Re: How Can I Create the Category list to look like this?

This is a fairly straightforward example of using CSS to style an unordered list using a bottom border, padding and margins and a background image for the bullet. I recommend a quick Google search for something list "CSS vertical menus" and you'll find lots of tutorials telling you how to do this.

2 Jul 2006, 7:33 PM
#5
kuroi avatar

kuroi

Totally Zenned

Join Date:
Apr 2006
Location:
London, UK
Posts:
10,475
Plugin Contributions:
11

Re: How Can I Create the Category list to look like this?

A further thought would be that as you've presumably seen thios on another site, lift the hood and take a look inside. Even if you don't have all the fancy tools, you can look at the HTML by doing a View Source in your browser, and can then see from the header section of the HTML the path to the stylesheet.

2 Jul 2006, 7:43 PM
#6
robert_t avatar

robert_t

New Zenner

Join Date:
Aug 2005
Posts:
50
Plugin Contributions:
0

Re: How Can I Create the Category list to look like this?

I am good with CSS styles and classes but what I could not figue out was how to get the list to display with lines in between and not on either end. How can CSS do this?

2 Jul 2006, 7:46 PM
#7
kuroi avatar

kuroi

Totally Zenned

Join Date:
Apr 2006
Location:
London, UK
Posts:
10,475
Plugin Contributions:
11

Re: How Can I Create the Category list to look like this?

I would guess ...> border-bottom: 1px dotted blackapplied to an <a> tag sitting inside a wider <li> tag with margin used to push the <a> to the right.