Trouble with hiding elements on mobile devices

Topic: Trouble with hiding elements on mobile devices

daveordid asked 3 years ago

I'm trying to hide the banner video section of my Bootstrap 4 developed website on mobiles (as I can't get it to play on them) but I can't get it to work. First I tried adding a custom class and putting '@media(max-width:768px) { .customclass {display:none;} }' in the CSS but that didn't work.

Then, in the html, I tried using 'd-none d-md-block' in the class of element - - but that still didn't work.

Does anyone know what I'm doing wrong? Here's the site for reference:



Marta Wierzbicka staff pro premium answered 3 years ago


you have to change media queries in your own code to smaller:

@media screen and (max-width: 1080px) #headerwrap { display: none !important; }

Best, Marta

Please insert min. 20 characters.


Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.



Specification of the issue
  • User: Free
  • Premium support: No
  • Technology: General Bootstrap questions
  • MDB Version: -
  • Device: Mobiles
  • Browser: all
  • OS: All
  • Provided sample code: No
  • Provided link: Yes