Support Forum

Please note that this forum is only available to you in read only mode. In order to contribute to this conversation you will need to renew your subscription.

Menu text disappears when width is changed

zentoolsIf you use Zentools please post a review at the Joomla! Extensions Directory.

When I change the width of the window (to see what the site looks like on a iPod, for example), the writing in the menu disappears.

I am using "Fruity" as theme for the Lifestyle2 template, but have changed it to shades of grey.

Included is a screenshot.
Attachments:
  • shannsu's Avatar
  • shannsu
  • 3 Month Basic
  • 56 posts
  • Karma: 0
Last Edit: 5 years 7 months ago by shannsu. Reason: incorrect pic format
The administrator has disabled public write access.
Have you changed any custom css that might cause this?

Normally at this point I'd say do you have a link for the site? - so I can view the css applying

Cheers
Paul
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.
The following user(s) said Thank You: shannsu
Yes, I changed the colour scheme. Not being able to use ThemeMagic, I had to code it. I used the .less files, then compiled them using the ThemeMagic compiler. Not elegant, but it worked... sort of! ;)

The site is here: healthycrusine.com
  • shannsu's Avatar
  • shannsu
  • 3 Month Basic
  • 56 posts
  • Karma: 0
The administrator has disabled public write access.
You need to turn off the right click plugin so we view the site using troubleshooting tools

Cheers
Paul
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.
The following user(s) said Thank You: shannsu
Oh! And another thing...

That menu is awfully narrow (no margin on the left side) and very difficult to navigate (it keeps on disappearing if you don't position the curser exactly right when choosing menu options in submenus).

Can that be modified?
  • shannsu's Avatar
  • shannsu
  • 3 Month Basic
  • 56 posts
  • Karma: 0
The administrator has disabled public write access.
I will, but only for a short while... DONE.
  • shannsu's Avatar
  • shannsu
  • 3 Month Basic
  • 56 posts
  • Karma: 0
Last Edit: 5 years 7 months ago by shannsu.
The administrator has disabled public write access.
Thanks

You have this style

@media (max-width: 1019px)
.navbar-collapse ul a {
color: #D1D0CE !important;
}

That appears to be the problem with the text colour
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.
The following user(s) said Thank You: shannsu
Menu wise are we referring to the mobile menu?

Cheers
Paul
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.
The following user(s) said Thank You: shannsu
Yes. I think? You mean the menu that would be used for mobile devices, right? Then, yes.
  • shannsu's Avatar
  • shannsu
  • 3 Month Basic
  • 56 posts
  • Karma: 0
The administrator has disabled public write access.
ah ok - sorry for the confusion I've moved on to look at the height issue

With the height problem it that the mobile menu?
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.
Height & WIDTH (mostly width), is for the NON-mobile menu.

But I DO SEE what you mean by "Height issue". The menu is so long (in Mobile-view style) and we can't scroll down. There are only a fraction of the recipes showing, and there are 3 more main-menu-options that don't show at all.

Is there a way to make only the main-menu options show (and then to have users scroll down each one individually) instead of having every menu option displayed at the get-go?

I appreciate your help in this matter! Thanks a gazillion Paul!
  • shannsu's Avatar
  • shannsu
  • 3 Month Basic
  • 56 posts
  • Karma: 0
Last Edit: 5 years 7 months ago by shannsu.
The administrator has disabled public write access.
I modified the colour JUST ON THIS instance.

@media (max-width: 1019px)
.navbar-collapse ul a {
color: #D1D0CE !important;
}

It solved some of the problem, but not all. As you can see if you go look at it now.
  • shannsu's Avatar
  • shannsu
  • 3 Month Basic
  • 56 posts
  • Karma: 0
Last Edit: 5 years 7 months ago by shannsu.
The administrator has disabled public write access.
Regarding the mobile are you meaning when clicked it reveals the drop down or something else?

Cheers
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.
CSS wise

There is also

@media (max-width: 1019px) {
.navbar-default .navbar-nav .open .dropdown-menu > li > a, .navbar-default .navbar-nav .open .dropdown-menu > li > span {
color: #D1D0CE !important;}
}
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.
The following user(s) said Thank You: shannsu
The colours have been changed. The contrast is better.

Now, I still have the problem of the Mobile-menu being way too long and not being able to scroll down on a computer (so it basically is useless, not to mention it blocks the view of the entire page when displayed). It works fine on actual Mobile devices.

Is there a way to fix that?

You mentioned a HEIGHT issue?

Thanks again!
  • shannsu's Avatar
  • shannsu
  • 3 Month Basic
  • 56 posts
  • Karma: 0
Last Edit: 5 years 7 months ago by shannsu.
The administrator has disabled public write access.
Hi

We are due to release an update which may help - I'll check on this later today

Cheers
Paul
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.
The following user(s) said Thank You: shannsu
Super! Thanks a million!
  • shannsu's Avatar
  • shannsu
  • 3 Month Basic
  • 56 posts
  • Karma: 0
The administrator has disabled public write access.
I'll get back to you later today we are just waiting for some feedback from a user

Cheers
Paul
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.

zentoolsIf you use Zentools please post a review at the Joomla! Extensions Directory.

Happy Campers