Problems with placement of the q-input textarea cursor (when form is inside MODAL)

ssuess

Whether I am inside a cordova app or in mobile Safari, there are a number of cursor and typing problems with the textarea q-input type. Sometimes the cursor is outside the field, sometimes typing is blank (and then shows up a few seconds later). Is anyone else having these problems? They are worse on ios11 than they are on ios 10.3, but both platforms suffer problems with this input.

ssuess

I have tracked this down to the form existing inside a modal. If it is NOT in a modal, this cursor input problem does not happen. Anyone else seeing this? Any advice on how to mitigate??

ssuess

In case it helps someone else, I have a fix. Fortunately, when a modal is open, the body tag gets a with-modal class. Although it is set to have overflow hidden, it was NOT set to fixed position, which fixed (pun intended) my problem.

.with-modal {
position: fixed !important;
}

et Voila! One small side effect (which does not bother me, but might bother some) is that the page will scroll to the top when setting position fixed, and will not return to its position when closing the modal.

derrickbass

@ssuess said in Problems with placement of the q-input textarea cursor (when form is inside MODAL):

.with-modal {
position: fixed !important;
}

Thanks for finding and sharing this. It seems to work well.

pedrolucas

Thanks about this

benoitranque

Doesn’t position: relative also fix the problem?