If I keep the width of the site to a desktop size, but drag the lower re-size window handle to squish the menu and icons on the left vertically, the spacing of the menu gets smaller and eventually the icons disappear and the text squishes more to ensure that the menu can fit gracefully in the allotted space.
This is great, and looks very nice.
The problem is that as soon as I scale the window horizontally to a mobile size (the size I think would most benefit from this squished format), this doesn’t happen anymore.
When the site is in mobile size, it shows all the icons for the links and has the full vertical spacing.
How can I have this scale like it does when it’s on a desktop min-width as when on mobile I do not like seeing the vertical scroll bars on the menu if I don’t have to.
Hi Tia,
I see what you mean now. But it is not an issue. Because it looks okay on all the device format (Desktop, tablet and mobile).
When you squeeze the screen, you need to refresh the page because of the ajax. The important thing is it has to look good on all devices and it has not got any problem with that. You are not able to change the width sizes on mobile devices so it should be a problem. Don’t you think so ?
Don’t get me wrong, it does look good on all devices, I just thought it would prevent scrolling through a long menu if when on mobile it wouldn’t display the icons and would provide a smaller vertically presentation.
It does look good though.
On the flip side, having the icons makes it easier to touch with your finger which is a plus on mobile.
After careful consideration, I’m not actually sure which way I want it. I’ve left it for now.