[froguitar]

Hi!
How can I change the width of the side menu (left menu). I would like to set a wider width than the default.
Thank you in advance for your help.

[serkan]

Hi froguitar,
You can use this custom css code;

.header-wrap { width: 150px; }

Thanks

[froguitar]

I tried this, but it isn’t work.
The problem is that I increase the font on the menu, for example, 14 px and appears horizontal scroll. Therefore I need to increase the width of the menu.
Of course I use empathy theme.

in main.css it looks like this:

.header-wrap {
position: fixed; z-index: 2000; width: 120px; left: -120px; top: 0; bottom: 0; overflow: auto; overflow-x: hidden; -webkit-overflow-scrolling: touch;
}

How to change it, or overwrite custom.css to get a wider menu, which also works correctly on mobile devices?

[serkan]

Could you provide me your related url please?

[froguitar]

I have child theme, and when I add:

.header-wrap { width: 150px; }

to style.css for child theme, THEN IT WORKS, but only in desktop view (on my phone there is a problem)

url: http://frog.vipserv.org/cv/

[serkan]

Hi froguitar,
You can try to use this custom css code;

.header-wrap { width: 150px; left: -150px; }

[froguitar]

For phone this is almost good solution – hamburger menu good, but the menu is not exposed in the entire width. Unfortunately disappears text and icons in desktop view… You can see it in this moment (http://frog.vipserv.org/cv/)

[froguitar]

OK. Now it is quite ok. I added a few lines. I have:

.header-wrap { width: 140px; }

@media (max-width: 768px)
{
.header-wrap { width: 130px; left: -130px}
}

And it’s good (I think)

Thanks serakan for your help.

[serkan]

Hi, Your header wrap left -120px now. If you decrease to -140px, it will be okay.

.header-wrap { left: -140px; }

Thanks