How to automatically hide the upload file drag&drop area on mobile device?

4. 4. How to automatically hide the upload file drag& dropon mobile device .

This is not possible to do directly, but you could achieve it by adding the CSS code to your jotform that would hide it unless the device is wider than the usual mobile devices.

@media screen and (max-device-width: 768px) {
    #id_299 {
        display: none;
    }
}

However, it is good to point out that at this time your drag and drop widget is set as required and if only hidden the submission would not be possible - because the field would not be filled out.

To resolve this you would need to set it to non-required instead.

You can see here how to add the CSS to your jotform: Inject Custom CSS Codes

Hi Ben

I have tried but the problem was not resolved. i tried with what you provided and then i put in the /* I */ just like the capture below but does not work.

please help and thanks.

I presume that you have added the code at the top. Please always add it at the bottom of the styles (under all others).

It should have still worked, but please note that it would have done so only if the device width is matching the rule, not if the browser is resized to a different size, so you should check with the device that has its pixel width under 768px.