...
The default behavior in iOS is to zoom the browser into a field when a font size < 16px has been specified (or not font size is specified at all). This can be helpful to come users and a distraction to others. To disable this behavior, use the CSS below to set the font size on components that accept text input. There is no need to apply this to a specific component. It is by default configured to apply to all text and textarea components.
Code Block | ||||
---|---|---|---|---|
| ||||
input[type='text'], input[type='number'], textarea { font-size: 16px; } |
...
There may be times when a form designer wants to display specific components exclusively to mobile users. Using the class 'hide-on-desktop' on a component after embedding this style will ensure the component only displays on devices with a mobile screen size.
Code Block | ||||
---|---|---|---|---|
| ||||
@media only screen and (min-width:600px) { .hide-on-desktop { display: none; max-height: 0; overflow: hidden; } } |
...