Order Steps (tableless) support thread

[clydejones]

Sorry, didn't think you would check it!
http://creationcassel.com/storetest

Change the following (as indicated by the highlight) in each of the css files I provided above:

.progressmeter li {float:left; width:6em; min-height:3em; margin:0 .6em; padding-left:4em; color:#999; background:#FEF3C4 url(../images/numbers.gif) 0 4px no-repeat; list-style-type:none;}

[CaroleAs]

Spacing is perfect now, but i still have number 1 on the step 3.

And i just noticed that the right sideboxes are moved (probably because of the 650 pixels digit graphic as opposed to the initial 542). Do i adjust it in those css files?

[CaroleAs]

I will really seem like dont know what i want but i had NOT put the 650 pixel graphic when you checked earlier. Since i was not sure what the problem was, i reverted to the original files to start fresh. Sorry.

[clydejones]

Spacing is perfect now, but i still have number 1 on the step 3.

And i just noticed that the right sideboxes are moved (probably because of the 650 pixels digit graphic as opposed to the initial 542). Do i adjust it in those css files?

change the following as indicated by the highlihgt in each of the css files I listed above:

.progressmeter li.current.three {color:#FF9900;font-weight:bold;background-position:-280px -38px;}

[CaroleAs]

Hum... that is what is there already.

.progressmeter li.current.three {color:#FF9900;font-weight:bold;background-position:-280px -38px}

[CaroleAs]

Ok found one error (one typo). Now the digits are correct but the spacing is not. My guess is i will play with the padding?

And how do i get the right sideboxes back in their place?

[clydejones]

Ok found one error (one typo). Now the digits are correct but the spacing is not. My guess is i will play with the padding?

And how do i get the right sideboxes back in their place?

change the width from 650px to 600px


.progressmeter {overflow:auto; margin:1em auto;width:650px;}

[CaroleAs]

Fixing one thing messes something else

Changing the 650 to 600 cuts off the right side of the "progress bar" and the number 4 along the way.

(i dont know if you tried the checkout in the French side of the store. It is even more obvious)

[clydejones]

Fixing one thing messes something else

Changing the 650 to 600 cuts off the right side of the "progress bar" and the number 4 along the way.

(i dont know if you tried the checkout in the French side of the store. It is even more obvious)

You could try adjusting the overall width of your site: you'd do that in the stylesheet.css

#mainWrapper {
background-color: #ffffff;
text-align: left;
/*width: 750px;*/
width: 970px;
vertical-align: top;
border: 1px solid #1884e9;
}

[CaroleAs]

Thanks for your help. I dont want to hijack this thread.

I will work a bit more by trial an error to try to align things. I love the add-on though!

Quick question. In earlier posts of this thread, some screenshots were showing a progress bar. Has this been removed in later versions or did i mess up something to make it disappear since i never saw it in my store.