Need to create mobile first gallery

Hi attached is the site image for a gallery as I want it to appear on mobile.
How do I go about creating this mobile first gallery and specifically how do I create the menu icons - previouse, masonary display, next and menu items in the hamburger on the right.


Please could you point me to any tutorials for the best way to create a mobile first site and specifically how to create the menu bar.

I can create the desk/lap top gallery but don’t know how to reduce it to a presentable site on mobile
Thanks for any help

Maybe u will try to search for software programm ?

Thanks olih,
Yes that’s what I’m trying, Googling: “mobile first” css grid example
produces some very helpful results - so I now have a responsive design.
Still don’t know how to produce the menu bar at the top on a mobile device.
Any ideas / pointers?

There’s an article here that will help with the hamburger effect and off screen menu. There are plenty of others around like this one.

There is nothing special about a mobile menu. It’s just basic CSS (apart from the open and close which is usually js) but the rest is just styling things with css and media queries until its fit for purpose.

If you know how to code in CSS then you already know how to create the menu bar. Just use media queries to alter the desktop display at widths where the desktop menu is no longer viable. If you don’t know CSS then you will either have to learn or pay someone to do it for you. We can help if you want to learn properly.

If you want specific advice on your actual page then you would need to post the html and CSS that you are using or even better a link to the page concerned or a working codepen.

Unfortunately I am away until next week so someone else will have to jump in until I get back .:slight_smile: