johnwilson Posted June 29, 2020 Share Posted June 29, 2020 Site URL: https://www.theathleticbridge.com/ Hello, I am trying to figure out how to resize solely the background image of my mobile website, it keeps getting cutting off (as shown below). Would I be able to edit this in CSS? I've been trying to find some code on these forums but nothing has worked yet. Thank you! Link to comment
Solution rwp Posted June 29, 2020 Solution Share Posted June 29, 2020 (edited) <style> @media only screen and (max-width: 600px) { .section-background { background-color: black !important; } .section-background img { height: 50vh !important; margin-top: 25vh; } } </style> Put this in the code injection for the page you want it to work on. Edited June 29, 2020 by rwp johnwilson 1 Link to comment
johnwilson Posted June 30, 2020 Author Share Posted June 30, 2020 (edited) Thank you so much! It worked! Edited June 30, 2020 by johnwilson Link to comment
johnwilson Posted June 30, 2020 Author Share Posted June 30, 2020 @rwp So it worked great for the home page, however it changed my "Contact Us" page to being all black instead of the contrasting white page that it was. Is there anyway around that obstacle now? Link to comment
rwp Posted June 30, 2020 Share Posted June 30, 2020 Make sure you put the code in the code injection section of the home page. Not in the site wide code injection area. tuanphan and johnwilson 1 1 Link to comment
johnwilson Posted June 30, 2020 Author Share Posted June 30, 2020 @rwp Awesome! Thank you so much for your assistance! rwp 1 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