Hi, I am having some issues with “product” section on a home page ( that area below blog posts where images of olive oil are)… when in smartphone view, then text goes outside of the container What is the best way to fix that? I tried to remove the images so the text has enough space but then image also disappears in desktop and tablet view… Any better layout suggestions maybe??
Besides that there is a problem with footer section, also in smartphone view… I would like if elements somehow are one bellow other and aligned center, not like now… logo on the left, contact in the middle and the links on the right…
I’m unable to view your site now as I’m on mobile, but the most common cause for this is you have set a fixed width for an element/s that are wider than the page width.
Try using ‘auto’ on elements that contain other elements - they should then expand as the content inside needs them to. @Waldo helped me some time ago with a similar query.
Re: your footer, i’ve just had a look, and seems like all you need to do is go into mobile view, click on the logo and go to the ‘typography’ section and choose the ‘centre’ option (currently left). Same with the text blocks, centre those (currently right aligned). Give them a little padding/margin for spacing and it’s sorted.
(Tip: changing something in desktop view cascades down to other views, but make a layout change in say mobile and it stays just on mobile - doesn’t cascade up to desktop)
Hi @74ecrivain - I agree! sunny and bright! I really like the photo and colours in the footer - nice… - I would suggest running all your photos through tinypng.com (or other image compression website) to fully optimize the file sizes. As you have a blog, adding more and more unoptimized images might make the Designer (and the site) a bit sluggish and slow to load in the future. Also make the images actual size (i.e. your wine bottle images are 670px x 670px but you have ‘Image is HiDPI’ ticked as 195px - If your images are 195px when ‘Image is HiDPI’ is ticked, the actual size should be 390px x 390px). Lastly, you have Shutterstock watermarks on your main image! Just some helpful suggestions, as requested, I hope! Good luck with the site! Regards Kai