Trouble with hiding elements on mobile devices

web
mobile

Topic: Trouble with hiding elements on mobile devices

daveordid asked 4 months 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 pro premium answered 4 months 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.
Status

Answered

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