User selects first word on line, but Safari selects something different (on website on iOS)

When the user wants to select the first word on the line, Safari selects something different:

User tries to select "practical", but "very practi" is selected

It doesn’t make any sense. I have tried this so many times, it’s not possible to be just "misclick". It happens in every first word each line.

I have special markup, when every word is one <span> element:

.question {   font-size: 2rem;    width: 230px; }
<div class="question">   <span data-id="8897">The</span>    <span data-id="12072">coffee</span>    <span data-id="12072">table</span>    <span data-id="651">is</span>    <span data-id="5232">made</span>    <span data-id="5910">of</span>    <span class="test-fill">________</span>.    <span data-id="4357">I</span>    <span data-id="20645">do</span><span data-id="5744">n't</span>    <span data-id="8886">think</span>    <span data-id="4358">it</span><span data-id="651">'s</span>    <span data-id="9580">very</span>   <span data-id="6273">practical</span>.  </div>

I tried other values of user-select, but it doesn’t change anything.

Without <span>s it works just fine. But <span>s are important because data-id attribute…

Asked on August 30, 2020 in iOS.
Add Comment
0 Answer(s)

Your Answer

By posting your answer, you agree to the privacy policy and terms of service.