Printable View
Mr. Herbert<
Just wanted to thank you for your help. I forgot I tried to get CSS to get them to line up earlier, and never took them out. I guess I have to get more proficient with the firebug program, would have told me. This problem drove me carazy, so thanks for taking a look at my site.
Mike
Hi Glenn
This mod has been and will continue to be a Godsend.
I feel a bit of a dunce for not knowing this but the drop-down boxes are pushing content to the right of the page. I'm pretty sure I need to add 'position:absolute' to the css somewhere but I can't figure out where - I fear it may not even be within Flexible Attributes but I feel I have to cover all options. Here's a link to one of the pages in question (I'm still at the tinkering stage so the site is a long way from being finished):
http://www.picturename.co.uk/catalog...roducts_id=186
Hope you can help. I'm in can't-see-the-wood-for-the-trees territory at the mo'.
Cheers
I tried following the method discussed by gjh42 and tsrplatelayer to set up columns of attributes, but I must be missing something... I am trying to set up three columns of attributes. Each column should have three attribute drop-down menus, as such:
Column 1:
Juice flavor 1 [dropdown]
Juice flavor 2 [dropdown]
Juice flavor 3 [dropdown]
Column 2:
Meal bar flavor 1 [dropdown]
Meal bar flavor 2 [dropdown]
Meal bar flavor 3 [dropdown]
Column 3:
Dessert flavor 1 [dropdown]
Dessert flavor 2 [dropdown]
Dessert flavor 3 [dropdown]
I would also like to be able to add a unique column "header" icon above each column... is that possible?
Can anyone please help me to determine how such a setup would be accomplished using the stylesheet_flexible_attributes.css file?
Thanks!
First off, to get the column organization you want, you will need to sort the attributes like
Juice flavor 1 [dropdown]
Meal bar flavor 1 [dropdown]
Dessert flavor 1 [dropdown]
Juice flavor 2 [dropdown]
Meal bar flavor 2 [dropdown]
Dessert flavor 2 [dropdown]
Juice flavor 3 [dropdown]
Meal bar flavor 3 [dropdown]
Dessert flavor 3 [dropdown]
Then you can use stylesheet rules to force new lines after every third attribute, giving a "column-like" layout.
Juice flavor 1 [dropdown] Meal bar flavor 1 [dropdown] Dessert flavor 1 [dropdown]
Juice flavor 2 [dropdown] Meal bar flavor 2 [dropdown] Dessert flavor 2 [dropdown]
Juice flavor 3 [dropdown] Meal bar flavor 3 [dropdown] Dessert flavor 3 [dropdown]
For the "Column x" headings, you could use read-only attributes.
The readme describes the pattern of style rules to produce columns. Among others, these
#wAttrib-11 {clear: left; float: left;}
#wAttrib-12 {float: left;}/*this will sit beside #wAttrib-11*/
adjusted to the actual ids will make the columns.
{clear: left; float: left;} will start a new line, and let the next attribute sit beside this one.
{float: left;} will let this attribute sit beside the previous one.
Quote:
Originally Posted by gjh42
AWESOME, it is working great. Thanks so much for your help!!
I am trying to get my radio buttons to line up side by side and can't seem to get the right code in the .css file. This my css file
/*attribute layout*/
.wrapperAttribsOptions label {font-size: 1.0em;}/*make "label" elements match other text*/
h3#attribsOptionsText {display: none;}/*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*/
#wAttrib-6 {clear: left; float: left;}
#wAttrib-6 {float: left;}/*this will sit beside #wAttrib-11*/
#wAttrib-6 {float: left;}/*this will sit on a new line*/
/* #wAttrib-6 h4 {display: none;}
/* #wAttrib-6 h3 {font-size: 1em; font-weight: normal;}/*make comments above attribute like standard text*/
/* #wAttrib-35 .attribsOptions {display: none;}/*for a read-only attribute to hide all but comments*/
you can see the product here
readingglasses4less.com/index.php?main_page=product_info&cPath=1_15&products_id=67
Could you help please?
Add to your stylesheet
.wrapperAttribsOptions label+br {display: none;}
Sorry it's taken a while to respond - been away for a while.Quote:
Originally Posted by gjh42
Thanks for this. Worked a treat.
hi,
i've just installed Flexible Attributes and i can't get it to lay my checkboxes out horizontally. my code looks like this;
/*attribute layout*/
.wrapperAttribsOptions label {font-size: 1.0em;}/*make "label" elements match other text*/
h3#attribsOptionsText {display: none;}/*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*/
#wAttrib-129 {float: left;}
#wAttrib-130 {float: left;}/*this will sit beside #wAttrib-11*/
#wAttrib-131 {float: left;}
#wAttrib-132 {clear: left;}/*this will sit on a new line*/
#wAttrib-133 h4 {display: none;}
#wAttrib-15 h3 {font-size: 1em; font-weight: normal;}/*make comments above attribute like standard text*/
#wAttrib-35 .attribsOptions {display: none;}/*for a read-only attribute to hide all but comments*/
what am i doing wrong?!
sorry if i'm being really stupid!
url http://mitdts.co.uk/olive2/index.php...products_id=54
You have this rule which causes all of those checkboxes to each take the full page width:
stylesheet.css (line 507)
.attribImg {
margin: 0.3em 0;
width: 100%;
}
Change it to 33% or whatever works for you.