@radaApeta , sorry you can change the code like this
Result:
Topic summary
A user seeks help making a shoe sizing chart table more readable in a popup on mobile devices. The desktop version displays correctly, but the mobile layout is poorly arranged.
Multiple solutions offered:
- Several developers provide CSS code snippets to be added to theme.liquid or base.css files
- Code targets responsive table styling with max-width, display properties, and text alignment adjustments
- Solutions use media queries to specifically address mobile viewport widths (typically max-width: 767px-949px)
Iterative refinements:
- Initial solution works but user requests EU column repositioned to the left with more spacing between columns
- Further adjustment needed because Nike/Jordan tables have 5 columns while others have 4, causing inconsistent appearance
- User standardizes all tables to 4 columns and requests heading/subtitle alignment match desktop version
Resolution:
Final code solution from BSSCommerce-B2B successfully addresses all requirements. User confirms the fix works perfectly for both desktop and mobile versions.
