Resposive Mobile and display: none - Wordpress - Visual Composer

Question

Hello i have a problem with hide one row (exactly background) on mobile and tablet device i try give class to row : “none” and add css but this dont work on mobile

http://scr.hu/0wj8n/x00rp

@media screen and (max-device-width: 900px){
  .none {
    display: none !important;
    visibility: hidden !important;
}
}

@media screen and (max-device-width: 900px){
  .none {
    background-image: none !important;
}
}

Answer 1

Your code should work on an actual phone/tablet. It doesn't work in these emulators because the max-device-width refers to the device width, not the width of the iframe window. In the emulator, the device is your computer, which almost certainly has a larger physical screen width than 900px. So, for development, use max-width instead:

@media screen and (max-width: 900px){
  .none {
    display: none !important;
  }
}

@media screen and (max-width: 900px){
  .none {
    background-image: none !important;
  }
}

On production, feel free to use max-device-width. More on this here.