I managed to solve the horizontal alignment issue.
This is what I did:
/*attribute layout*/
.wrapperAttribsOptions label {font-size: 1.0em;}/*make "label" elements match other text*/
h3#attribsOptionsText {display: none;}/*'Display: None;' to hide the "Please Choose:" heading*/
h4.optionName {font-size: 1.0em;}
.wrapperAttribsOptions+br.clearBoth {display: none;}/*allow floated attributes to sit side by side if desired*/
/*Blank space above 'Right Eye, RE(OD)' Attribute.*/
#wAttrib-35 {clear: left;}/*this will sit on a new line*/
#wAttrib-35 .attribsOptions {display: none;}/*for a read-only attribute to hide all but comments*/
/*This line aligns all attributes' discription in one roll(first roll)*/
#wAttrib-35 {float: left; width: 12em;} /*This line ensures 'Right Eye, RE(OD)' is displayed with enough column width.*/
#wAttrib-36, #wAttrib-37, #wAttrib-38, #wAttrib-38, #wAttrib-39, #wAttrib-40, #wAttrib-41 {float: left; width: 7em;}
/*This line aligns all Right Eye attributes in one roll(second roll)*/
#wAttrib-20 {float: left; width: 12em;} /*This line ensures 'Right Eye, RE(OD)' is displayed with enough column width.*/
#wAttrib-21, #wAttrib-22, #wAttrib-23, #wAttrib-24, #wAttrib-31, #wAttrib-32 {float: left; width: 7em;}
/*For some unknown freak reason that I can't get Attributes 25, 26, 27, 28 and 29 line up all together the next roll,
I created Attribute 30 to do a 'roll break'.*/
#wAttrib-30 {clear: left;}/*this will sit on a new line*/
#wAttrib-30 .attribsOptions {display: none;}/*for a read-only attribute to hide all but comments*/
/*This line aligns all Left Eye attributes in one roll(third roll)*/
#wAttrib-25 {float: left; width: 12em;} /*This line ensures 'Left Eye, LE(OS)' is displayed with enough column width.*/
#wAttrib-26, #wAttrib-27, #wAttrib-28, #wAttrib-29 ,#wAttrib-33, #wAttrib-34 {float: left; width: 7em;}
/*Align Dropdown Box Below Attribute's OptionName*/
/**
#wAttrib-20 .back {float: none;}, #wAttrib-21 .back {float: none;}, #wAttrib-22 .back {float: none;}, #wAttrib-23 .back {float: none;},
#wAttrib-24 .back {float: none;}, #wAttrib-25 .back {float: none;}, #wAttrib-26 .back {float: none;}, #wAttrib-27 .back {float: none;},
#wAttrib-28 .back {float: none;}, #wAttrib-29 .back {float: none;}
**/
/*Sizing comments above Right Eye and Left Eye attributes to bold text with 1em text size*/
#wAttrib-20, #wAttrib-25 h3 {font-size: 1em; font-weight: bold;}
/*Eliminate attributes' option name (other than 'Righte Eye' and 'Left Eye')*/
#wAttrib-21 h4 {display: none;}, #wAttrib-22 h4 {display: none;}, #wAttrib-23 h4 {display: none;}, #wAttrib-24 h4 {display: none;},
#wAttrib-26 h4 {display: none;}, #wAttrib-27 h4 {display: none;}, #wAttrib-28 h4 {display: none;}, #wAttrib-29 h4 {display: none;},
#wAttrib-31 h4 {display: none;}, #wAttrib-32 h4 {display: none;}, #wAttrib-33 h4 {display: none;}, #wAttrib-34 h4 {display: none;}
/**EOF**/
This is the result:
http://cplens.com/index.php?main_pag...3755054f1b3f45
Now I need to add both RE's QTY and LE's QTY to Shopping Cart's QTY total. Can anyone direct me to a forum discussion that address this issue please?
Thanks.
Bookmarks