Attribute spacing

Right now my attributes are just too darn close together. I've spent the last hour or two searching the "attribute spacing" threads and so far I haven't found anything that worked. If I change my width, margins, padding shown below in my stylesheet it still doesn't change anything. I've made several changes and nothing helps. Have you run into this before?

/Attributes/
.attribImg
{ width:20%;
margin:0.3em 0;}

Ian
http://mowerpartsupply.com/catalog/index.php?main_page=product_info&cPath=66_68&products_id=183

bump bump

r1formetoo:

Right now my attributes are just too darn close together. I've spent the last hour or two searching the "attribute spacing" threads and so far I haven't found anything that worked. If I change my width, margins, padding shown below in my stylesheet it still doesn't change anything. I've made several changes and nothing helps. Have you run into this before?

/Attributes/
.attribImg
{ width:20%;
margin:0.3em 0;}

Ian
http://mowerpartsupply.com/catalog/index.php?main_page=product_info&cPath=66_68&products_id=183

R1,
First problem first...

Attributes, Force to Select

Right now I can add to the cart and not select a Hole Diameter.. BAD.  I am automatically linked to the shopping cart with the default no Hole Diameter, but really I wanted 1/2 inch..

The beauty of this procedure: Is a warning box appears at the top of the page stating they have not selected a attribute color you offer to the customer.

Example of what it should look like in the Option Value Manager:
(The 0, 10, 20, 30 are the sort orders)

Please Select Hole Diameter 0
1/2 inch 10
5/8 inch 20
9/16 30

You need to add one extra value To Hole Diameter:

   1. In the Option Value Manager under Hole Diameter
   2. Add the following: Please Select Hole Diameter
   3. Sort Order 0


Now in Attribute Controller for each product with this Value:

   1. Add, Please Select Hole Diameter to product, sort order 0
   2. Associate the flag properties to Please Select Hole Diameter
   3. Under Attribute Flags: the colored boxes
   4. Yellow box, Used for Display purpose only: Click Yes
   5. Tan box, Default Attribute to be marked selected: Click Yes
   
This will force a proper choice by the customer ....

https://www.zen-cart.com/tutorials/index.php?article=57  

haredo:

R1,
First problem first...

Attributes, Force to Select

Right now I can add to the cart and not select a Hole Diameter.. BAD. I am automatically linked to the shopping cart with the default no Hole Diameter, but really I wanted 1/2 inch..

The beauty of this procedure: Is a warning box appears at the top of the page stating they have not selected a attribute color you offer to the customer.

Example of what it should look like in the Option Value Manager:
(The 0, 10, 20, 30 are the sort orders)

Please Select Hole Diameter 0
1/2 inch 10
5/8 inch 20
9/16 30

You need to add one extra value To Hole Diameter:

1. In the Option Value Manager under Hole Diameter
2. Add the following: Please Select Hole Diameter
3. Sort Order 0

Now in Attribute Controller for each product with this Value:

1. Add, Please Select Hole Diameter to product, sort order 0
2. Associate the flag properties to Please Select Hole Diameter
3. Under Attribute Flags: the colored boxes
4. Yellow box, Used for Display purpose only: Click Yes
5. Tan box, Default Attribute to be marked selected: Click Yes

This will force a proper choice by the customer ....

https://www.zen-cart.com/tutorials/index.php?article=57

Well it took some playing with before I figured it out but now I definitely see what you mean and I appreciate you taking the time to show me that.  So, now that I've fixed that would you care to add your thoughts on how I can go about spacing the attributes out a bit so they are not jumbled together?

Ian

Ian,
Great you have figured the attributes out..
The mistake is in the 15 inch and 16 inch
Don't make text beside the attribute.

This has to be its own seperate attribute

1. Please select blade length
2. 15 inch
3. 16 inch

Then we can be able to control the spacing to look great

haredo:

Ian,
Great you have figured the attributes out..
The mistake is in the 15 inch and 16 inch
Don't make text beside the attribute.

This has to be its own seperate attribute

1. Please select blade length
2. 15 inch
3. 16 inch

Then we can be able to control the spacing to look great

Ok, so I did the same thing to my length attribute just as I did to my diameter attribute. Next, so how do I go about spacing them out a bit so they aren't jumbled up?

Ian

Ok, so I did the same thing to my length attribute just as I did to my diameter attribute. Next, so how do I go about spacing them out a bit so they aren't jumbled up?

Ian

R1,
I am at work right now, and don't have my little baby (laptop) with all my tools to view the site... Drats..

Going to take a stab in the dark (Ozzy Osborne)

Locate this:
includes/templates/mower/css/stylesheet.css

Find this:
.attribImg
{ width:20%;
margin:0.3em 0;}

Change to this:

.attribImg
{ width:20%;
margin:0.3em 3em 0em 0em;}

haredo:

R1,
I am at work right now, and don't have my little baby (laptop) with all my tools to view the site... Drats..

Going to take a stab in the dark (Ozzy Osborne)

Locate this:
includes/templates/mower/css/stylesheet.css

Find this:
.attribImg
{ width:20%;
margin:0.3em 0;}

Change to this:

.attribImg
{ width:20%;
margin:0.3em 3em 0em 0em;}

Well I tried that and it didn't change anything. I'm not sure why but I've noticed that when I change stuff in that bit of code the does never changes at all. Could it be that something else is over riding this bit of code? I've tried changing the margins, the width, and I've added padding and still nothing moves.

Ian

you can give this one a try .. after applying , test the site to see if everything works ok ..

.back {stylesheet.css (line 574)
float:left;
margin:0 0 1.1em; <<< just add this
}

tony_sar:

you can give this one a try .. after applying , test the site to see if everything works ok ..

.back {stylesheet.css (line 574)
float:left;
margin:0 0 1.1em; <<< just add this
}

Well, I tried that and it might have shifted the attributes down 1 pixel or so but they ultimately didn't get any space between the two so that they aren't cramed right next to each other. Nice try though.

Ian

what do you mean by attributes .. ? do you want space between your option buttons or do you want space between the two different attributes ?

if is between two attributes , you can increase 1.1em to 1.5em , and even more depending on how far you want them to be separated

tony_sar:

what do you mean by attributes .. ? do you want space between your option buttons or do you want space between the two different attributes ?

if is between two attributes , you can increase 1.1em to 1.5em , and even more depending on how far you want them to be separated

I'd basically like to move my attributes so they are spacing more like what you see below.

Ian
https://www.mowerpartsupply.com/images/attributes.jpg

R1,
Hey, back home now

Look great now, Nice homework
Here is the fix for the spacing...

.back {
float:left;
margin: 0em 0em 1.3em 0em;}

i know the solution , but for life of me , i can not find the div that is doing it in any page.

this div is wrapping all attributes .. if float is removed or set to centre , attributes will show the way you want. but can not find as its where about it.

you can set float to this

.wrapperAttribsOptions {stylesheet.css (line 196)
margin:0.3em 0;
}

but your dropdown will stay in left hand and will shift the option to right side , and thats not something you want i guess.

Ok guys, I think we are missing some big picture here because I tried making both of those changes you guys suggested and neither change, along with the dozen I've tried myself, actually made a single change to the web page itself. It's as though our changes are being overwritten by something else. But what?

Ian

bump bump