#1 WordPress forum plugin created by gVectors Team

wpForo – WordPress Forum Plugin
  • Home
  • Forum
  • Migrate to wpForo
  • Addons
  • Addons Demo
  • Documentation

Forum

Home | Forum

wpDiscuz - WordPress Comment Plugin
  • Forums
  • Members
  • Recent Posts
Forums
Main Support Forums
How-to and Troubles...
Static mobile menu ...
 
Share:
Share
Tweet
Share
Notifications
Clear all

[Solved] Static mobile menu doesn't fit

    Last Post
RSS

Hype Matrix
Posts: 51
 Hype Matrix
Topic starter
May 7, 2021 2:02 pm
(@hypematrix)
Trusted Member
Joined: 1 year ago

Hello,

I'm using the following code for the static mobile menu but the search icon doesn't fit on the end of the menu, is there any way around this? maybe shrink the gaps in between the menu items?

@media screen and (max-width: 620px){
#wpforo #wpforo-wrap #wpforo-menu .wpf-menu, #wpforo #wpforo-wrap #wpforo-menu #wpf-menu {
display:flex;
}
#wpforo #wpforo-wrap #wpforo-menu .wpf-res-menu {
display: none !important;
}
#wpforo #wpforo-wrap #wpforo-menu .wpf-menu, #wpforo #wpforo-wrap #wpforo-menu #wpf-menu {
position: static; text-align: center;
}

Please see attached.

Thanks

 IMG_3462.PNG
Topic Tags
mobile mobile issues mobile menu search icon search
7 Replies
7 Replies
Tutrix
 Tutrix
Beta Tester
(@tutrix)
Joined: 2 years ago

Honorable Member
Posts: 631
May 7, 2021 4:12 pm
Reply toHype MatrixHype Matrix
Posted by: @motorhype

maybe shrink the gaps in between the menu items?

try

@media screen and (max-width: 620px){
#wpforo #wpforo-wrap #wpforo-menu li a {
    padding: 15px 10px;
}
}

visit my wpForo > Tutrix.de with lots of customization & modification, inclusive chat

Reply
Hype Matrix
 Hype Matrix
(@hypematrix)
Joined: 1 year ago

Trusted Member
Posts: 51
May 7, 2021 5:02 pm
Reply toTutrixTutrix
Hype Matrix

@tutrix 

That worked thanks, I just added it underneath the old code, do I need to remove any or all of of the old code?

@media screen and (max-width: 620px){
#wpforo #wpforo-wrap #wpforo-menu .wpf-menu, #wpforo #wpforo-wrap #wpforo-menu #wpf-menu {
display:flex;
}
#wpforo #wpforo-wrap #wpforo-menu .wpf-res-menu {
display: none !important;
}
#wpforo #wpforo-wrap #wpforo-menu .wpf-menu, #wpforo #wpforo-wrap #wpforo-menu #wpf-menu {
position: static; text-align: center;
}

Reply
Hype Matrix
 Hype Matrix
(@hypematrix)
Joined: 1 year ago

Trusted Member
Posts: 51
May 9, 2021 9:59 am
Reply toTutrixTutrix
Hype Matrix

@tutrix

I'm now left with the following code, is any part of it unused and can be removed?

@media screen and (max-width: 620px){
#wpforo #wpforo-wrap #wpforo-menu .wpf-menu, #wpforo #wpforo-wrap #wpforo-menu #wpf-menu {
display:flex;
}
#wpforo #wpforo-wrap #wpforo-menu .wpf-res-menu {
display: none !important;
}
#wpforo #wpforo-wrap #wpforo-menu .wpf-menu, #wpforo #wpforo-wrap #wpforo-menu #wpf-menu {
position: static; text-align: center;
}
}
@media screen and (max-width: 620px){
#wpforo #wpforo-wrap #wpforo-menu li a {
padding: 15px 10px;
}
}

Thanks

Reply
Tutrix
 Tutrix
Beta Tester
(@tutrix)
Joined: 2 years ago

Honorable Member
Posts: 631
May 9, 2021 11:15 am
Reply toHype MatrixHype Matrix
Tutrix
Hype Matrix

@motorhype

You have this code twice, you can delete one

@media screen and (max-width: 620px){
#wpforo #wpforo-wrap #wpforo-menu li a {
padding: 15px 10px;
}
}

otherwise it's ok

you can test everything from the browser inspector

watch the Video https://www.screencast.com/t/i55WlLUUXrX

visit my wpForo > Tutrix.de with lots of customization & modification, inclusive chat

Reply
Hype Matrix
 Hype Matrix
(@hypematrix)
Joined: 1 year ago

Trusted Member
Posts: 51
May 9, 2021 11:45 am
Reply toTutrixTutrix
Hype Matrix
Tutrix
Hype Matrix

@tutrix

Will it safe to delete this:

@media screen and (max-width: 620px){
#wpforo #wpforo-wrap #wpforo-menu .wpf-menu, #wpforo #wpforo-wrap #wpforo-menu #wpf-menu {
display:flex;
}

Reply
Tutrix
 Tutrix
Beta Tester
(@tutrix)
Joined: 2 years ago

Honorable Member
Posts: 631
May 9, 2021 12:05 pm
Reply toHype MatrixHype Matrix
Tutrix
Hype Matrix
Tutrix
Hype Matrix

@motorhype

remove it and you will see the result 😉 

or watch the video again and you will see the result too 😉 
In the video I remove the "a" from the "display" so that the code is not executed

 

or open your page with the Browser Inspector and remove the code, then you will also see the result 😉 

visit my wpForo > Tutrix.de with lots of customization & modification, inclusive chat

Reply
Hype Matrix
 Hype Matrix
(@hypematrix)
Joined: 1 year ago

Trusted Member
Posts: 51
May 9, 2021 12:23 pm
Reply toTutrixTutrix
Hype Matrix
Tutrix
Hype Matrix
Hype Matrix

@tutrix

Thanks 🙂 

Reply
  All forum topics
  Previous Topic
Next Topic  
Related Topics
  • Slight changes to my forum
    1 month ago
  • Font Size of Forum on my blog too small on Mobile
    4 months ago
  • Breadcrumb on mobile
    4 months ago
  • How to fix user details spacing in post (MOBILE only)
    5 months ago
  • facebook login on mobile not showing
    6 months ago
Topic Tags:  mobile (26), mobile issues (7), mobile menu (5), search icon (4), search (17),

Forum Search

Join Us!

Download wpForo plugin
on WordPress.org

wpForo Addons

wpforo-private-messages wpforo-advanced-attachments-128x128 wpforo-embeds-128x128 wpForo User Custom Fields addon wpForo – Blog Cross Posting addon wpForo Ads Manager wpForo – WooCommerce Memberships Integration wpForo Emoticons wpForo – Tenor GIFs Integration
View all Addons »

Recent Topics

  • Suggestion How to make new user to get approve manually before creating post and profile.

    By Adhyansh21, 13 hours ago

  • Posts deleted in database still show up on front-end

    By nylex, 15 hours ago

  • Not all links are automatically added with the "nofollow" attribute

    By st7878, 18 hours ago

  • Editors assign users to groups

    By mike_netinfo, 20 hours ago

  • Set password link opens forum login page instead of set password page

    By JanJan, 20 hours ago

  • User banned for using icons?

    By JanJan, 20 hours ago

Topic Tags

  • css52
  • translation50
  • plugin conflict48
  • seo47
  • new features45
  • buddypress43
  • avatar41
  • moderation40
  • ultimate member40
  • login40
  • forum40
  • registration37
  • threaded layout35
  • cache34
  • editor33
  • menu33
  • spam32
  • shortcode32
  • forum accesses30
  • widget29
View all tags (2190)

Recent Posts

  • RE: recover deleted forum categories

    I didn't delete the categories on the forum, just did s...

    By Asmadi1, 5 hours ago

  • recover deleted forum categories

    hi I need help, I accidentally deleted categories and f...

    By Asmadi1, 6 hours ago

  • RE: Not all links are automatically added with the "nofollow" attribute

    I have no idea, i guess not.

    By dimalifragis, 6 hours ago

  • RE: How to make new user to get approve manually before creating post and profile.

    Thanks again

    By Adhyansh21, 10 hours ago

  • RE: Posts deleted in database still show up on front-end

    Ok then, wait until someone from wpForo support will he...

    By dimalifragis, 13 hours ago

  • RE: Set password link opens forum login page instead of set password page

    Hi @janjan, Go to Dashboard > Forums > Settings...

    By Chris, 17 hours ago

  • RE: Editors assign users to groups

    Hi @mike_netinfo, Only administrators can change user...

    By Chris, 18 hours ago

Share:
Share
Tweet
Share
  Forum Statistics
21 Forums
9,933 Topics
50.2 K Posts
5 Online
48 K Members

Latest Post: recover deleted forum categories Our newest member: w88hiw88casino080 Recent Posts Unread Posts Tags

Forum Icons: Forum contains no unread posts Forum contains unread posts

Topic Icons: Not Replied Replied Active Hot Sticky Unapproved Solved Private Closed

Powered by wpForo | Copyright © 2016-2022 gVectors Team
Copyright Registration Service - Click here for more information or to register work
wpForo is Registered with the IP Rights Office
Copyright Registration Service

Ref: 4477265538
  • Home
  • Forum
  • Migrate to wpForo
  • Addons
  • Addons Demo
  • Documentation