• Zen Cart Experts
  • Web Sites
  • Training & Support
  • Content Management
  • Other Services
  • Quick Zen Cart CSS Hint – Attribute Label Alignment

    Ever looked at a product page that has attributes and think, “Man, that looks screwy!”?  One of the default CSS rules is at fault and should always be changed in your stylesheet.css.

    For example, you have a download file with a radio button.  So it says:

    Download (button) zip file.

    The default CSS has the button and the zip file higher  in some browsers (maybe all) than the Download which is the label.

    Look for the line for LABEL, h4.optionName. (I’m 99.9% sure that this is not used anywhere besides the product info page.)

    Change it to

    LABEL, h4.optionName {
    line-height: 1.5em;
    padding: 0px; margin: 0px 3px 0px 3px;
    }

    The default style has a top margin  that is causing the lack of alignment.

    Enjoy!

    Author: Delia Wilson Lunsford, Founder & CEO, WizTech, Inc.