How can I change the text size and colour of the Categories text ?

[cerberus]

Hi all,
Me again.

How can I change the text size and colour of the categories text ? (see image) its all the categories text I want to change, including the sub categories in the drop down menu.

(I have tried and got nowhere, I presume its something to do with the user.css file maybe ? at least for the colour, and maybe the text size ? I have copied the empty user.css file to the override static folder as per instructions on the phoenix cart "change style and colour" instructions page, but I cannot work it out from there)

Thank you,
Steve

Screenshot 2026-09-12 032030.png

[Kofod95]

Assuming you have found the correct css-selectors using the browser inspection-tools, you may just need to do a hard refresh of your browser (Ctrl + F5), to tell your browser to reload the cached data.

You can read more here: https://phoenixcart.org/phoenixcartwiki ... ss_Changes

//Daniel

[cerberus]

Hi,

Thank you for your reply.

That assuming I have found the correct css-selectors using the browser inspection-tools, that is the issue, I dont understand what I am looking at, so I am getting nowhere (I am using firefox inspect, and viewbug, but it is not helping, just confusing)

And I use opera browser with a cleaned out cache every time for checking any alterations I do to the site.

[tessthepup]

Hi,

Thank you for your reply.

That assuming I have found the correct css-selectors using the browser inspection-tools, that is the issue, I dont understand what I am looking at, so I am getting nowhere (I am using firefox inspect, and viewbug, but it is not helping, just confusing)

And I use opera browser with a cleaned out cache every time for checking any alterations I do to the site.

@cerberus
Try this, changing the color and the font size to what you need it to be.

Code: Select all

.navbar-dark .navbar-nav .nav-link {
  color: #963720 !important;
  font-size: 1.5rem;
}

.navbar-light .navbar-nav .nav-link {
  color: #963720 !important;
  font-size: 1.5rem;
}

nav .nav-link {
  color: #963720 !important;
  font-size: 1.5rem;
}

nav .nav-link a{
  color: #963720 !important;
  font-size: 1.5rem;
}

.dropdown-item {
  font-size: 1.5rem;
}

[cerberus]

Hi tessthepup,
Thank you, that was very helpful.

However I do have one question, I found it also altered the "New? Start Here" message in the Customer Services module/block in the footer of the page, is their a way to stopping it from doing that ? or is it because it is all linked in some way ?

See pic for the text in the footer that changed size as well (just the text changed with the red arrow pointing at it)

when I changed the colour of the code you supplied it also changed the colour of that text in the footer as well as well

UPDATE : I removed the " "New? Start Here" text message in the Customer Services module/block in the footer (and left the button) that solved my issue

And to add, I found holding down the shift key on the keyboard and hitting the Reload icon on the browser can force a "hard refresh" to see any changes (I am also using Brave browser).

Screenshot 2026-09-13 150039.png

[tessthepup]

Hi tessthepup,
Thank you, that was very helpful.

However I do have one question, I found it also altered the "New? Start Here" message in the Customer Services module/block in the footer of the page, is their a way to stopping it from doing that ? or is it because it is all linked in some way ?

See pic for the text in the footer that changed size as well (just the text changed with the red arrow pointing at it)

when I changed the colour of the code you supplied it also changed the colour of that text in the footer as well as well

UPDATE : I removed the " "New? Start Here" text message in the Customer Services module/block in the footer (and left the button) that solved my issue

And to add, I found holding down the shift key on the keyboard and hitting the Reload icon on the browser can force a "hard refresh" to see any changes (I am also using Brave browser).



Screenshot 2026-09-13 150039.png

@cerberus
Can you send the link to the site so we can see what has changed?

[burt]

Going by the image in your fist post, I think you want to be targetting this;

.cm-header-menu {
//css code here
}

[Mort_Lemur]

You may (or may not of course) want to take a look at this addon, it might be just what you are looking for if you are customising an out of the box phoenix installation. - Its a lot easier than fighting around css

app.php/addons/free_addon/phoenix_visual_designer/

[cerberus]

Hi tessthepup, and burt,

I solved it in the end, I reformatted the text in the footer account php and that put it back to normal, see image.

(the code to change the category text colour and size also altered the size and colour of the text in the footer account php)

Screenshot 2026-09-14 123304.png

Screenshot 2026-09-14 123930.png

And the category text colour and size code you supplied worked

Screenshot 2026-09-14 124422.png

And thank you both for your help

(however I will have more questions later )

[PiLLaO]

Don't use css inline on catalog, try to use bootstrap clases to change style