[Skip to main content](#vessel-content) # Cart Styling ## - **[srtdesigns](/forum/user/55639-srtdesigns "View srtdesigns's Profile")** - [![srtdesigns's Avatar](https://www.hikashop.com/media/kunena/avatars/resized/size144/users/avatar55639.png)](/forum/user/55639-srtdesigns "View srtdesigns's Profile") Topic Author - [ Offline](/forum/user/55639-srtdesigns) Less More - Posts: 70 - Thank you received: 4 - - 3 years 10 months ago [\#348219](#348219) by [srtdesigns](/forum/user/55639-srtdesigns "View srtdesigns's Profile") *[Cart Styling](/forum/27-checkout/905689-cart-styling#348219 "-- HikaShop version -- : 4.7.0 -- Joomla version -- : 4.2.6 -- PHP version -- : 8.0.26 -- Browser(s) name and version -- : Edge Version 108.0.1462.54 (Official build) (64-bit) I am almost there but unable to finalising styling. I have attached a screenshot of 4 areas I would like some assistance with please. 1: How can you change the colour of the circles in the cart wizard? 2: How can you delete the word each? 3: How can you center align the quantity column; e.g. qty, refresh icon and delete icon? The Title is center aligned but not the rest. 4: How can you text align right the Subtotal, shipping, VAT and total? I have tried the obvious but have had no luck. Many thanks.")* was created by *[srtdesigns](/forum/user/55639-srtdesigns "View srtdesigns's Profile")* -- HikaShop version -- : 4.7.0 -- Joomla version -- : 4.2.6 -- PHP version -- : 8.0.26 -- Browser(s) name and version -- : Edge Version 108.0.1462.54 (Official build) (64-bit) I am almost there but unable to finalising styling. I have attached a screenshot of 4 areas I would like some assistance with please. 1: How can you change the colour of the circles in the cart wizard? 2: How can you delete the word each? 3: How can you center align the quantity column; e.g. qty, refresh icon and delete icon? The Title is center aligned but not the rest. 4: How can you text align right the Subtotal, shipping, VAT and total? I have tried the obvious but have had no luck. Many thanks. - [ ![cart_styling.png](/forum/attachment/56303) ](/forum/attachment/56303 "cart_styling.png") [ ](/forum/attachment/56303?download=1 "cart_styling.png") Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzI3LWNoZWNrb3V0LzkwNTY4OS1jYXJ0LXN0eWxpbmc/dG1wbD1tYXJrZG93bg==) or [Create an account](/component/users/registration?Itemid=101) to join the conversation. - **[Philip](/forum/user/34318-philip "View Philip's Profile")** - [![Philip's Avatar](https://www.hikashop.com/media/kunena/core/svg/person.svg)](/forum/user/34318-philip "View Philip's Profile") - [ Offline](/forum/user/34318-philip) Less More - Posts: 4820 - Thank you received: 652 - - 3 years 10 months ago - 3 years 10 months ago [\#348223](#348223) by [Philip](/forum/user/34318-philip "View Philip's Profile") Replied by *[Philip](/forum/user/34318-philip "View Philip's Profile")* on topic *[Cart Styling](/forum/27-checkout/905689-cart-styling#348223 "-- HikaShop version -- : 4.7.0 -- Joomla version -- : 4.2.6 -- PHP version -- : 8.0.26 -- Browser(s) name and version -- : Edge Version 108.0.1462.54 (Official build) (64-bit) I am almost there but unable to finalising styling. I have attached a screenshot of 4 areas I would like some assistance with please. 1: How can you change the colour of the circles in the cart wizard? 2: How can you delete the word each? 3: How can you center align the quantity column; e.g. qty, refresh icon and delete icon? The Title is center aligned but not the rest. 4: How can you text align right the Subtotal, shipping, VAT and total? I have tried the obvious but have had no luck. Many thanks.")* Hello, First, to get off to a good start, let's talk in detail about the theory of selector precedence. This often explains CSS customization failures. How to build high priority css command ? **1.** First the minimum necessary to function properly :[/b] Check that your selector is **well written**, good class (or Id) html and no mistake or typo If your command is visible in your **browser inspector tool**, but is overridden (css command crossed out), then his priority isn't strong enough. [ ![alt](https://i.postimg.cc/MTGmj6nv/override-css.png) ](https://i.postimg.cc/MTGmj6nv/override-css.png "alt") **2.** Now, some css priority system explanation :[/b] From less to the highest priority : **.html\_class\_element {command: value} .html\_class\_module .html\_class\_element {command: value} .html\_class\_page .html\_class\_module .html\_class\_element {command: value} .html\_class\_page .html\_class\_module .html\_class\_element {command: value !important;}** Note, that if **2** css commands have strictly the **same selector**, then the **last written** in the css file will be the one used. Now, in order to be more specific and better understand step by step to your questions : **"1: How can you change the colour of the circles in the cart wizard?"** [ ![alt](https://i.ibb.co/0MwcLXY/screenshot.png) ](https://i.ibb.co/0MwcLXY/screenshot.png "alt") Your Css command is "background-color", and you can add in order to increase priority with "**hikashop\_wizardbar**" class. html\_container.hikashop\_wizardbar html.element\_class { command: value; } **"2: How can you delete the word each?"** You can use your browser inspector tool, point your element you want to edit, then right-click => Inspect (or inspector tool). You will see a new window, that will display the html in order to get the correct element class. Then write something like this : **html\_container.class html\_element.class { display: none; }** **"3: How can you center align the quantity column; e.g. qty, refresh icon and delete icon? The Title is center aligned but not the rest."** [ ![alt](https://i.ibb.co/RyNh2n9/screenshot1.png) ](https://i.ibb.co/RyNh2n9/screenshot1.png "alt") It seems, that you have several custom command css, in your style_custom. If you want everything center, then remove the "text-align: center;" or maybe the opposite for that matter. **"4: How can you text align right the Subtotal, shipping, VAT and total?"** With the same method than before, by using the inspector tool in order to get the required class elements. You can list several elements like this for the same commandes : **html.class1, html.class2, html.class3 { text-align: right; }** Hope this will help you to achieve what you need. Regards Last edit: 3 years 10 months ago by [Philip](/forum/user/34318-philip "View Philip's Profile"). The following user(s) said Thank You: [srtdesigns](/forum/user/55639-srtdesigns "View srtdesigns's Profile") Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzI3LWNoZWNrb3V0LzkwNTY4OS1jYXJ0LXN0eWxpbmc/dG1wbD1tYXJrZG93bg==) or [Create an account](/component/users/registration?Itemid=101) to join the conversation. - **[srtdesigns](/forum/user/55639-srtdesigns "View srtdesigns's Profile")** - [![srtdesigns's Avatar](https://www.hikashop.com/media/kunena/avatars/resized/size144/users/avatar55639.png)](/forum/user/55639-srtdesigns "View srtdesigns's Profile") Topic Author - [ Offline](/forum/user/55639-srtdesigns) Less More - Posts: 70 - Thank you received: 4 - - 3 years 9 months ago [\#348477](#348477) by [srtdesigns](/forum/user/55639-srtdesigns "View srtdesigns's Profile") Replied by *[srtdesigns](/forum/user/55639-srtdesigns "View srtdesigns's Profile")* on topic *[Cart Styling](/forum/27-checkout/905689-cart-styling#348477 "-- HikaShop version -- : 4.7.0 -- Joomla version -- : 4.2.6 -- PHP version -- : 8.0.26 -- Browser(s) name and version -- : Edge Version 108.0.1462.54 (Official build) (64-bit) I am almost there but unable to finalising styling. I have attached a screenshot of 4 areas I would like some assistance with please. 1: How can you change the colour of the circles in the cart wizard? 2: How can you delete the word each? 3: How can you center align the quantity column; e.g. qty, refresh icon and delete icon? The Title is center aligned but not the rest. 4: How can you text align right the Subtotal, shipping, VAT and total? I have tried the obvious but have had no luck. Many thanks.")* Perfect, all changes made. Many thanks. The following user(s) said Thank You: [Philip](/forum/user/34318-philip "View Philip's Profile") Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzI3LWNoZWNrb3V0LzkwNTY4OS1jYXJ0LXN0eWxpbmc/dG1wbD1tYXJrZG93bg==) or [Create an account](/component/users/registration?Itemid=101) to join the conversation. Board Categories HikaShop Install & Update Product & Category Display Content Creation Sales and Orders Orders management Reports & Statistics Customers Checkout Payment Methods Shipping Methods Import & Export (CSV, XLS…) Specific Features Affilation Taxes Wishlist Vote Carousel & Slider Mass Actions Filters & Search Discount & Coupon Feature Request Integrations Showcase General Talk about HikaShop Development HikaShop 3.0 Beta Translation Commercial Jobs HikaShop Components HikaMarket Market: Feature requests Market: How to? Market: Bug Report HikaSerial General talk about HikaSerial Serial: Bug Report Serial: How to? Support en Français de HikaSerial (French Support) HikaSubscription HikaAuction Auction: Feature requests Auction: How to? Auction: Bug report Hikashop around the world Support en Français (French Support) Russian FAQ. Курс выживания с Hikashop. Частые вопросы и о Расширения Hikashop Наши сайты на Hikashop 日本語版サポート(Japanese Support) Thai German Archives Bug Report How to? [](/forum/topics/feed/mode-topics?format=feed&type=rss) Time to create page: 0.059 seconds [Powered by](/forum/credits) [Kunena Forum](https://www.kunena.org)