Zen Cart Logo
Forums / Templates, Stylesheets, Page Layout / Problem with long product category names wrapping to 2 lines

Problem with long product category names wrapping to 2 lines

Locked

Views: 1,364

Results 1 to 2 of 2
This thread is locked. New replies are disabled.
28 Dec 2007, 10:26 AM
#1
veazer avatar

veazer

New Zenner

Join Date:
Apr 2005
Posts:
51
Plugin Contributions:
0

Problem with long product category names wrapping to 2 lines

I am building a site based on the iC_AcadameV1.2 template, see here: www.k-conversions.co.uk.

I'm having a problem with the way long names wrap on the category sidebox.

In Firefox, it looks like this:

and in IE looks like this:

I though it seemed strange to fix the height of the menu items, so I changed the CSS from

li.category-top a{
    padding:.4em 0 [B]0[/B] 1.5em;
    margin:0;
    color:#333333;
    font-weight:bold;
    display:block;
     [B]height:1.8em;[/B]
    border-bottom:1px solid #9a9a9a;
    background:#EEEEEE url(../images/boxlistbg.gif) .4em 0.5em no-repeat;
    }
li.category-products a{
    padding:.4em 0 [B]0[/B] 2.3em;
    margin:0;
    color:#333333;
    font-weight:bold;
    display:block;
     [B]height:1.8em;[/B]
    border-bottom:1px solid #9a9a9a;
    background:#EEEEEE url(../images/boxlistbg.gif) 1.2em 0.5em no-repeat;
    }
```to

li.category-top a{
padding:.4em 0 [B].5em[/B] 1.5em;
margin:0;
color:#333333;
font-weight:bold;
display:block;
[B] /* height:1.8em; /[/B]
border-bottom:1px solid #9a9a9a;
background:#EEEEEE url(../images/boxlistbg.gif) .4em 0.5em no-repeat;
}
/
Added left padded and removed height to fix 2 line cats /
li.category-products a{
padding:.4em 0 [B].5em[/B] 2.3em;
margin:0;
color:#333333;
font-weight:bold;
display:block;
[B] /
height:1.8em; */[/B]
border-bottom:1px solid #9a9a9a;
background:#EEEEEE url(../images/boxlistbg.gif) 1.2em 0.5em no-repeat;
}


![](http://www.zen-cart.com/forum/attachment.php?attachmentid=3128&stc=1&d=1198836630)

but now IE is broken:

![](http://www.zen-cart.com/forum/attachment.php?attachmentid=3129&stc=1&d=1198836630)

Can anyone point me in the right direction? Sorry, i am still trying to get my head around CSS.
28 Dec 2007, 8:11 PM
#2
nomadrw avatar

nomadrw

Zen Follower

Join Date:
Sep 2007
Location:
Somewhere in Southern Cal
Posts:
331
Plugin Contributions:
0

Re: Problem with long product category names wrapping to 2 lines

I think you're in the right directions but you need to add
width: 150px; /the 150px; can be almost any number.
Make sure you do a back-up on your css before you make any changes, and write down the numbers you are using, that way you can alway go back too.

nomad