Menu/ Navigation Bar Suddely Looks Wierd


I have been doing my own R n D to customize my website. While I was able to fix the issue, I have developed a new one instead and I cannot make out what I did!

The plugin that I think created the issue, I have removed already, yet my navigation bar looks ugly now and in two lines. Please let me know how I can get that sorted.

My Site is:

Please help me, support team.



Dear Kleio,

Your navigation is quite long. It is resulting the last menu item is pushed down on certain screen width as the menu container becomes narrower. So you have to reduce the padding of the menu item to adapt with this situation. Could you please try to apply the following CSS code through the Simple Custom CSS plugin or child theme’s style.css?

#mainnav li {
   padding: 0 10px;   

I hope this reply helps.


Hi Kharis,

Thank you for your prompt reply.

This was part of the problem and now the menu is in one line, finally :slight_smile:

The other thing is that the black bar on the navigation has vanished. Now as my font is white, the menu bar does not show up in the other pages. I wanted the menu bar to remain static, but that has changed as well.

Can you please guide me with that too?

Thank you Kharis.

Hello there,

Try adding this code, please.

   background-color: rgba(0,0,0,0.3);


Dear Kharis,

Thank you so very much.

I am all sorted now.

I really appreciate your help.

Wishing you luck,