Hide a section for width ipad 1024PX and below

Community resources
1

Hey there, does anyone know how we could hide a section when the viewport width gets to 1024 px…and then have another section show for that specific width instead. The issue is ipad in landscape showing the desktop view and this section will be quite text heavy…basically we will show a different section with less text for ipad landscape…

Any help would be greatly appreciated

Thanks

2

So if you don’t want to use the usual hide on the built in breakpoints Webflow has you could use some custom code to hide and show:

@media screen and (min-width: 0px) and (max-width: 1024px) {
      #my-content{ display: block; }  /* show it on smaller screen */
    }
    @media screen and (min-width: 1025px) and (max-width: 5000px) {
      #my-content{ display: none; }   /* hide it on larger screens */
    }



<div id="my-content">
Shows only on screens having max width of 1024px. 
Resize your browser's width to see changes
</div>