Discuss and resolve questions on Liquid, JavaScript, themes, sales channels, and site speed enhancements.
I've tried to use the Custom CCS box at a section to hide that particular section on mobile screens, by adding:
@media screen and (max-width: 600px) {
display: none;
}
Unfortunately, the section is still visible on mobile screens .
The section itself is a Custom Content section (one of the standard sections of the Impulse Theme) containing HTML to display 5 formatted links.
The purple links under the banner look OK on desktop.
But on smaller screens (mobile devices)
those purple links don't look good and the section should be hidden
What are we doing wrong, when using the section level CSS box with the code snippet above?
Note: if we're able to hide a section on mobile, the next step is to add another section that can be shown only on mobile devices, and will be optimised for smaller screens.
Hello, for this you need to specify the item selector inside the media query, i.e.
@media screen and (max-width: 600px) {
.class-name {
display: none;
}
}
June brought summer energy to our community. Members jumped in with solutions, clicked ...
By JasonH Jun 5, 2025Learn how to build powerful custom workflows in Shopify Flow with expert guidance from ...
By Jacqui May 7, 2025Did You Know? May is named after Maia, the Roman goddess of growth and flourishing! ...
By JasonH May 2, 2025