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

Store Design
, , , ,
1

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↓

S__38961159.jpg
S__38961159.jpg960×1706 143 KB

Please check the following before it is published.

password: aolyia

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

Thank you for your support!

2

#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; }