Good day, I ran into a layout problem and don’t know where my legs grow from and how to fix it.

two identical classes behave differently on mobile devices,

  1. all OK enter image description here

  2. and here is the bug enter image description here for mobile phones I use <meta name = "viewport" content = "width = 1280">

A bug is noticed on both Anroid and iOS.

  • Please transfer the information from the document by reference to your question. Here you can also include images. - Timofei Bondarev

2 answers 2

Mobile browsers increase text in wide blocks. Add to html

html { -webkit-text-size-adjust: 100%; }

More details about this property and its problems, but at home I didn’t notice this

    This is how Font Boosting works in mobile browsers. Alternative solutions. Set the viewport to the screen width by adding a tag:

     <meta name = "viewport" content = "width=device-width, initial-scale=1">

    Or specify in CSS:

     html * {max-height: 1000000px;}