How to make an Full-hight image in the mobile background?

[Havana2024]

HELLO,

I applied the code below that you provided, but the background image is not displayed on mobile.

Can you solve it?

↓

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.css / based.css file and paste the code in the bottom of the file.

#contact{
height: 100%;
width: 100%;
background-image: url('your-image-url.jpg');
background-size: cover;
background-position: center;
opacity: 0.7;
z-index: -1;
}

I want to set a background image only on the Contact page.

I want to set it to full size height and add a watermark so I can put text on top.

image↓

Please check the following before it is published.

19964f-7b.myshopify.com

password: aolyia

CONTACT PAGE : https://havanagroup-official.com/pages/contact

Thank you for your support!

[BlackHorseMedia]

#contact { position: relative; min-height: 100vh; width: 100%; }

#contact::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: url('your-image-url.jpg'); background-size: cover; background-position: center; background-attachment: fixed; opacity: 0.7; z-index: -1; }