Product CSS in version 2.5


https://forum.kartris.com/Topic2570.aspx
Print Topic | Close Window

By TheCalicoTree - Wed 13 Nov 2013
Hi,

I'm usually pretty good at CSS but I cannot figure this one out.

In older Kartris versions, product versions display with price, qty and Add button all in one row.
http://www.hotel-buyer-store.co.uk/Bathroom/Mirrors/Extendible-Shaving-Mirror__p-19-101-224.aspx

In the new version however, the Add button displays below the qty. This is ugly and a waste of space (particularly in multiple version products).

http://devsite1.thecalicotree.co.uk/Bathroom/Mirrors/Extendible-Shaving-Mirror__p-19-101-224.aspx

I've noticed that this is not a problem on your demo site but that is running the Kartirs skin. My skin was based upon the Kartris Accordion skin with reduced width product area.
Can you shed any light on this - is it to do with the foundation css?
By Paul - Thu 14 Nov 2013
Try to check if you have this line in your sections.css

.versions td.addtobasket div { background-color: transparent; background-image: none; display: inline; }


I think the last item, the display inline is the important bit as it stops the divs which are created by ASP.NET rendering the update panels from being 'block' and therefore full width.
By TheCalicoTree - Thu 14 Nov 2013
Hi Paul,

Yes that line does exist. Do you have the same problem with your out of the box Accordion CSS?

Thanks

Helen
By Paul - Fri 15 Nov 2013
Works ok for me locally, see attached image.

Make sure your user controls are all up to date, especially the ProductVersions one and the AddToBasket - have a feeling there were 'inline' settings on the updatepanels somewhere in one or both of those