- This topic is empty.
June 17, 2014 at 2:10 am #172923
I’m in the process of trying to make our site more mobile friendly (www.stickerscape.co.uk). It was created using a Joomla theme however there are a couple of elements on the homepage that don’t quite appear as I’d like for mobile so wondered if you guys (and girls) can give me a few pointers:
- Main menu navigation – the width is set at 100% however the menu slips on to two rows when viewed on mobile
- Module in the top right does not dynamically resize on mobile. I created this myself (and am no expert) but wondered if there was something I can easily add to the CSS to improve how this appears on mobile?
Any thoughts would be great. I’ve got some experience in tweaking CSS but by no means an expert so solutions in layman terms would be great!
MikeJune 17, 2014 at 2:19 am #172928
I suggest that you do some research on “Responsive Design” and review your existing code. In general, work in percentages for widths etc., use media queries where required to ensure the site works at various viewport widths.June 17, 2014 at 3:01 am #172940
Thanks very much for your quick response.
I’ll do some digging – I had hoped by setting the menu width to 100% it would solve it but I think the wrapper that the menu is contained in is a fixed width…June 17, 2014 at 3:28 am #172943
The wrapper you could set a percentage with if you want (if not it defaults to 100%) AND set a
max-widththe same as your current
widthand get the best of both worlds.
Then, if you have any other full width elements inside the wrapper you can just delete the widths altogether and they should default to 100%.
You may have issues with your slider because the images are 1024px wide so you’d need to find a way to scale those.
Also, you’d need to look into doing something about the menu breaking once the width gets below 1024px wide.June 17, 2014 at 4:42 am #172959
Thanks Paulie – I’ll investigate.
Do you know if there’s handy tool on the web where you can test your site at various resolutions to check to see out which point the formatting breaks?June 17, 2014 at 4:47 am #172961
- The forum ‘CSS’ is closed to new topics and replies.