Topic: Trouble with hiding elements on mobile devices

daveordid free asked 5 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: https://dcbproductions.co.uk/

Thanks

David


Marta Wierzbicka staff answered 5 years ago


Hi,

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.

FREE CONSULTATION

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

Status

Answered

Specification of the issue

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