Rmarkjr Posted December 18, 2023 Posted December 18, 2023 (edited) I have Wordpress 7.0 Hello! I have had this website look like this for a long time now and I am now actively trying to make it look better. On this particular page on my site the banner background image doesn't fit right on desktop and especially mobile. I have tried to edit the image with adding black to the bottom and sides of it... which has helped a bit. But I am looking for a few things. How do I position the top background image for both desktop and mobile? How would I use a different image for the mobile version only? and maybe a min height for the section so the image fits on mobile correctly without changing the min height for desktop Or a combination of the three? Basically, I am looking for a way to make the background image look good on mobile and be able to adjust it on desktop if it is not right. I have tried a few things that have not worked. Interestingly when I used this code, the only thing it did was mess up the gallery images on the bottom of the page. I found this code here: Edit the Mobile Banner Image in Squarespace 7.0 | Rebecca Grace (rebeccagracedesigns.com) /* CSS FOR MOBILE */ @media @mobile { /* Insert Code for Mobile Below This Line*/ #ceramic-paint-coatings img { display: none; } #ceramic-paint-coatings .sqs-block-image img { display: block; } #ceramic-paint-coatings { background: url('https://images.squarespace-cdn.com/content/59a8f97b2994ca2e6f88a601/1693894372479-NKQAASZZQ2EZ1KPDYK25/Ceramic+Coating+Page+Banner.png?content-type=image%2Fpng'); background-repeat: no-repeat; background-size: 100%; } /* Insert Code for Mobile Above This Line */ } I am sure that there is other code that I need to do what I am looking for, but I am not sure what it is, and I am not good with code at all. Any help would be great. Thank you! Edited December 18, 2023 by Rmarkjr
tuanphan Posted December 19, 2023 Posted December 19, 2023 Can you share link to your site? We can check easier Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)
Rmarkjr Posted December 19, 2023 Author Posted December 19, 2023 I guess for some reason the where you insert the link in the post is not working. I tried twice, but this is it, High-End Ceramic Coating Service For Jenks, OK - Kaliber Auto Detailing
tuanphan Posted December 21, 2023 Posted December 21, 2023 On 12/20/2023 at 1:32 AM, Rmarkjr said: I guess for some reason the where you insert the link in the post is not working. I tried twice, but this is it, High-End Ceramic Coating Service For Jenks, OK - Kaliber Auto Detailing The image is fine to me Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment