sub-category display problem

[121webconsultancy]

Hi

Having spent what seems like eons checking layout settings and my css.. if anybody can suggest how this problem has occurred and more more importantly how to rectify it - I would be most grateful!

Please see: http://flashharrys.com/index.php > Click on the single store category > The sub-categories now display with a break between each link! I'm 99.9% sure this is not a css problem, but basically I can't lost the space between each sub-cat.

Any ideas how I can lost the break/space????

Cheers,

Steve

[gjh42]

I can't see where it comes from, but you have extra margin below all of ypur subcat links.
In your stylesheet find

}
A.category-subs, A.category-products, A.category-subs:visited, A.category-products:visited {
    background-position: 15px 9px;
    padding-left: 25px; 
    font-size: 11px;
    font-weight:normal;
    } 

and add

margin-bottom: -13px;

to get

}
A.category-subs, A.category-products, A.category-subs:visited, A.category-products:visited {
    background-position: 15px 9px;
    padding-left: 25px;
        margin-bottom: -13px;
    font-size: 11px;
    font-weight:normal;
    } 

[121webconsultancy]

I tried that Glenn ... and look what happens!....

[121webconsultancy]

I've put it back to it's original state now so as not to confuse anybody. In short, Glenn's suggestion didn't have any effect on the space I want to lose.. it just reduced the cell height. .. Thanks all the same Glenn.

Anybody else???...

[haredo]

Try this:

Add this in your string,
margin-top: -1em;

A.category-top, A.category-top:visited, A.category-top:hover, A.category-links, A.category-links:visited, A.category-links, A.category-links:visited, A.category-subs, A.category-products, A.category-subs:visited, A.category-products:visited
{
display: block;
padding-left: 14px;
padding-right: 2px;
padding-top: 6px;
padding-bottom: 6px;
background: #F3F2F7;
background-image: url(../images/bullet.gif);
background-repeat: no-repeat;
background-position: 4px 10px;
font-size: 12px;
font-weight: bold;
color: black;
border-bottom: 1px solid #CCCCCC;
border-left: 1px solid #CCCCCC;
border-right: 1px solid #CCCCCC;
}

[gjh42]

Ok, it's in the top cat too...

Move the margin: -13px; up to the main cat line:

A.category-top, A.category-top:visited, A.category-top:hover, A.category-links, A.category-links:visited, A.category-links, A.category-links:visited, A.category-subs, A.category-products, A.category-subs:visited, A.category-products:visited

I notice the purpose: to space the info box down from the cat box. Haven't located the culprit yet, but it was put in the wrong place and should be moved. Then the -13px here can be dispensed with.

[gjh42]

Or use margin-top: -13px; in the original location and assume the box separation is ok as is...

[121webconsultancy]

Got it... it was a mix of both your guys suggestions:

A.category-subs, A.category-products, A.category-subs:visited, A.category-products:visited {
background-position: 15px 9px;
padding-left: 25px;
margin-top: -1.2em;
font-size: 11px;
font-weight:normal;
}

..was the answer!

Many thanks

[gjh42]

I notice that using -1.2em, there is a missing border below the first subcat. No idea why it should be missing there and nowhere else, but (with Edit CSS) using -13px restores the line.
You have used px everywhere else, use it here for consistency.

Or is the whole thing just a quirk of the particular view in my monitor?...

[121webconsultancy]

Strange! There was no missing border that I could see... However, I have now changed it to -13px ...which looks exactly the same this end .. does it look ok to you now???