sandra.bertalan Posted November 30, 2021 Share Posted November 30, 2021 Site URL: https://www.fireburndocumentary.com/ Hi 😊 This is very basic, but for some reason I'm not finding the right solution. I would like the image on the hero section and the image in the footer (row of logos) to stay full width in mobile. Right now it's turning awkwardly small. Working in SqSp 7.1 URL: https://www.fireburndocumentary.com (Section HOME and FOOTER) Thank you so very much! Sandra Link to comment
Beyondspace Posted December 1, 2021 Share Posted December 1, 2021 20 hours ago, sandra.bertalan said: Site URL: https://www.fireburndocumentary.com/ Hi 😊 This is very basic, but for some reason I'm not finding the right solution. I would like the image on the hero section and the image in the footer (row of logos) to stay full width in mobile. Right now it's turning awkwardly small. Working in SqSp 7.1 URL: https://www.fireburndocumentary.com (Section HOME and FOOTER) Thank you so very much! Sandra Is it the result you want to achieve? Try adding to Home > Design > Custom Css @media only screen and (max-width: 767px) { .page-content { padding-top: 0 !important; } .index-section-image img { width: 100% !important; height: auto !important; left: 0 !important; } .sqs-block-button-container--left [href*="awards"] { padding: 0.8em 1.6em; } } Let me know how it works on your site Press 👍 or mark this answer as solution to help another one too BeyondSpace - Squarespace Website Developer 🖼️ Lightbox Studio (Enable Pinch/Zoom on lightbox) 🗓️ Delivery Date Picker (Squarespace Date format) 💫 Animated Buttons (Referral URL) 🥳 Sparkplugin Customisations Browsers (Browse +100 Spark plugin customisations) 🥳 Elfsight Template Browsers (Browse +1000 Elfsight widget Templates) If you find my answer useful, let's leave a like or upvote so others with the same issue can find their solution. Thank you! Link to comment
sandra.bertalan Posted December 1, 2021 Author Share Posted December 1, 2021 Thank you @bangank36 for your input. Unfortunately this did not quite work. It still resized the image in a weird way. I am attaching screenshots to show you what I mean. "good" is the way it still shows nicely and "not good" is when the window gets too small and it makes the image (hence the film title) too small. Do you know how to solve this? Link to comment
Beyondspace Posted December 1, 2021 Share Posted December 1, 2021 (edited) 7 hours ago, sandra.bertalan said: Thank you @bangank36 for your input. Unfortunately this did not quite work. It still resized the image in a weird way. I am attaching screenshots to show you what I mean. "good" is the way it still shows nicely and "not good" is when the window gets too small and it makes the image (hence the film title) too small. Do you know how to solve this? 1. Is it Ok for the image (only image) after applying my codes? I set it with the full size on mobile. Before applied After applied 2. : Button: Do you mean setting it smaller, and moving it a little up on mobile? Edited December 1, 2021 by bangank36 BeyondSpace - Squarespace Website Developer 🖼️ Lightbox Studio (Enable Pinch/Zoom on lightbox) 🗓️ Delivery Date Picker (Squarespace Date format) 💫 Animated Buttons (Referral URL) 🥳 Sparkplugin Customisations Browsers (Browse +100 Spark plugin customisations) 🥳 Elfsight Template Browsers (Browse +1000 Elfsight widget Templates) If you find my answer useful, let's leave a like or upvote so others with the same issue can find their solution. Thank you! Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment