How to make a section visible on mobile but invisible on desktop?

ambientcandle19
Excursionist
47 0 4

Hey, can anyone give me the other half of this code?

I'm trying to be out of your hair. 

I have half the code that let me make a section invisible on desktop. But I don't have the other half to make it invisible on mobile. This in the code.

We were using google chrome then inspect

 

@media only screen and (max-width: 768px) {shopify-section-template--16879055372467__image_with_text_j8eNUK {display:none;}}
@media only screen and (min-width: 768px) {#shopify-section-template--16879055372467__image_with_text_AUwBFP {display: none;}}

 

what could the code for the opposite be to make the other images invisible to desktop and visible to mobile

 

 

Replies 5 (5)

deepaksharma
Shopify Partner
443 61 90

The first line hides an element when the screen is 768 pixels wide or less(hides on mobile)

 

while the second line hides a different element when the screen is wider than 768 pixels.(opposite)

Deepak Sharma || Shopify Developer || Helping eCommerce Stores
- Was my reply helpful? Accept it as solution
- Was your question answered? Mark it as an Accepted Solution.
-CHAT ON WHATSAPP | BUY ME A COFFEE | MAIL ME: ds2305187@gmail.com
ambientcandle19
Excursionist
47 0 4

Do you have a moment because it doesn't hide it on mobile only desktop. MAYBE the mobile is bigger than 768 pixels. I'm looking for a certain look. What if I change the 768 to 1000 or something and try again. 

 

The code only works one way on desktop. On mobile 1 see 4. 2 for each image with text section. 

And also I want it flush all the way to the sides. I want it to interfere with the boundaries of the image on mobile and completely take up the space no white border around it only on mobile

deepaksharma
Shopify Partner
443 61 90

can you provide me your store url and password if any.

and give the screenshot so i can help you with that

Deepak Sharma || Shopify Developer || Helping eCommerce Stores
- Was my reply helpful? Accept it as solution
- Was your question answered? Mark it as an Accepted Solution.
-CHAT ON WHATSAPP | BUY ME A COFFEE | MAIL ME: ds2305187@gmail.com
ambientcandle19
Excursionist
47 0 4

Screenshot_2024-03-07-15-33-06-40_40deb401b9ffe8e1df2f1cc5ba480b12.jpg

IMG_20240307_153338.jpg

  

lastcandles.myshopify.com no pw. 

 

See how it takes up the whole phone no white space and if you scroll down you see it it like overrides it 

ambientcandle19
Excursionist
47 0 4

I had to password protect the page. this is the password  "peawhi" because I have it chaotic so you can see. thanks