How can I hide a specific section only on desktop view?

Store Design
1

Help! I’m baffled.

I am trying to hide a section on desktop only and it’s not working.

I’m looking to hide #shopify-section-16268988909f0f72b3

i’ve used
@media screen and (min-width: 750px) {
#shopify-section-16268988909f0f72b3 {display:none;}}

but it’s still showing up on desktop.

i’ve also used

div#shopify-section-16268988909f0f72b3 {display:none;}}

and then @media screen and (max-width: 749px) {display:block}} but then it doesn’t show up on mobile!

Any insight would be greatly appreciated.

https://thehazelcollection.com/

password: glauts

Screenshot 2021-07-21 135739.png
Screenshot 2021-07-21 135739.png1525×1015 241 KB

2

@LBmedia

sorry for that issue can you please try this code

  1. Go to Online Store->Theme->Edit code
  2. Asset->/stylesheet.css->paste below code at the bottom of the file.
@media (min-width: 740px )  {
div#shopify-section-16268988909f0f72b3 {
    display: none;
}
}
3

Thanks for the info - I just tried and unfortunately it didn’t work - it is still showing up on desktop.

4

Hi,

I see that you put the code inside two block

@media screen and (max-width:740px) {

You should put the code outside any block

5

Thanks for this, it still didn’t work! I can’t get it hidden on desktop!

Any help is greatly appreciated.

6

hello @LBmedia

please Go to Online Store->Theme->Edit code then go to assets/theme.css ->paste below code at the bottom of the file.

@media only screen and (min-width: 749px) {
#shopify-section-16268988909f0f72b3{
	display: none !important;
}
}
7

Hey thanks for the advice, but it didn’t work- it’s still showing up on Desktop!!

8

@LBmedia

sorry but i can’t see above code where do you have add this?

9

hello @LBmedia

can you please share a screenshot of where to add code ?

10

Screenshot 2021-07-24 113131.png
Screenshot 2021-07-24 113131.png1730×890 103 KB

I’ve tried every variation possible that I can think of. Nothing is working.

11

@LBmedia it’s because one of your media-queries brackets isn’t closed properly. You don’t need so many media queries. If you’re trying to modify CSS it is better to write it in the media-query tag which is already available, rather than create another one.

12

THANK YOU!!

13

Hey @LBmedia , can you please tell me how you find the section id? I have been looking for hours already with no luck. Would be super grateful!

14

Just right click on the section and inspect it! You’ll find the id there! If you need help, send me a link and let me know which section you need and I can get the ID for you! @Jacquline

15

Thank you so much!

16

@LBmedia if there a way to hide a “custom liquid” section in Dawn on desktop only on a product page? I want to show a video on a mobile product page only, but not on desktop.

Thanks for your help!!