In the ectcart.css for v7.7.5 (ASP) there is this

/* Header div */
div.ectdivhead,div.checkoutsteps{
text-align:center;
border:1px solid gray;
padding:10px;
margin-bottom:10px;
display:flex;
justify-content:space-between;
align-items:center;
}

div.checkoutsteps REALLY messes things up on the checkout steps and took a while to figure out why the checkout steps went wonky after I updated. I commented out the div.checkoutsteps, but obviously that would have to be done with each update. Curious why it is there.


Marshall
CENLYT Productions - ms designs
Affordable Web Design
Custom Ecommerce Designs
Responsive Websites
Cenlyt.com

Hi Marshall
This is really just to give some kind of default style to the checkout steps. What you should really do is instead of commenting it out, redefine the offending style in your site style sheet. For instance it may be you need something like this...

div.checkoutsteps{
display:block;
}

As long as your site style sheet comes after the ectcart.css reference you'll get what is in your style sheet.

Vince



Click Here for Shopping Cart Software
Click Here to sign up for our newsletter
Click Here for the latest updater

I will add that when I recently updated, I removed some of my own styling so that ect styling was used, and everything started looking good.
So perhaps you have this same thing Marshall.
Marshall, I do have a clean install (No mods or css changes at all) of this version on my dev site if you want to see how the checkout looks there, just message me.

Thanks,
David

div.checkoutsteps{
display:block;
}

Fixed the problem, though I had to add text-align:left. I still feel it is unnecessary, especially this part justify-content:space-between; which made the text display with large gaps in between words.

Marshall
CENLYT Productions - ms designs
Affordable Web Design
Custom Ecommerce Designs
Responsive Websites
Cenlyt.com