miniBB ® 

miniBB

®
Support Forums
  
 | Start | Register | Search | Statistics | File Bank | Manual |
Specific miniBB Support Forums / Specific /  
 

Responsiveness top menu bar

 
Author Rider
Partaker
#1 | Posted: 25 Oct 2018 17:35 
Hi,

I installed the precompiled forum software and at the moment I am modifying the stylesheet etc. to meet the standards of our website.

One of the things I would like to achieve is to make the top menu bar responsive to the width of the browser's window. What I would like to achieve is that when you make the window's width (horizontally) narrower, the most right menu items that don't fit on the first line anymore are moved to the second line.

So for example on this forum you normally have this:
| Checker | Begin | Profile | Start New Topic | Favorites | Search | Statistics | File Bank | Manual | Logout |

And after narrowing down the window I would like to get something like this:

| Checker | Begin | Profile | Start New Topic | Favorites | Search | Statistics
| File Bank | Manual | Logout |


Anyone knows how I can manage to do this?

Author Paul
Lead Developer 
#2 | Posted: 25 Oct 2018 21:31 
I suppose you could try to replace & nbsp; in menu items to just an empty space, at the position where you'd like a menu item breaking to a new line. For example, putting it before {$l_sepr} but leaving after it should always keep the starting {$l_sepr} before a menu item.

Author Rider
Partaker
#3 | Posted: 25 Oct 2018 22:43 
Thanks. And bingo, it worked!
In the stylesheet in td.capMenu I greyed out white-space:nowrap;. This was basically already the answer to my question. But a new problem occured: menu items which consisted of more than 1 word (like "Personal Messages") only partially, i.e. word by word, moved to the second line. That's why I added &nbsp between the words in such menu items in the language-file. And now the menu bar is perfectly responsive!

Author Paul
Lead Developer 
#4 | Posted: 25 Oct 2018 23:16 
Rider
Good to know it works, thanks; perhaps I may consider of adding the same to the official version, worth having it without extra mods.

Specific miniBB Support Forums / Specific /
 Responsiveness top menu bar
 Share Topic's Link

Your Reply Click this icon to move up to the quoted message


  ?
Post as a Guest, leaving the Password field blank. You could also enter a Guest name, if it's not taken by a member yet. Sign-in and post at once, or just sign-in, bypassing the message's text.


Before posting, make sure your message is compliant with forum rules; otherwise it could be locked or removed with no explanation.

 

 
miniBB Support Forums Powered by Forum Software miniBB ® Home  Features  Requirements  Demo  Download  Showcase  Gallery of Arts
Compiler  Premium Extensions  Premium Support  License  Contact Us
Install the Captcha add-on: protect your miniBB-forums from the automated spam and flood.


  ⇑