Вот мой код:
<head>
<meta charset="UTF-8">
<title>document</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<style>
p {
font-size: 20px;
max-width: 100%;
}
</style>
<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Ipsam, perferendis. Accusamus totam pariatur libero dolorem maxime saepe distinctio perferendis vero hic molestiae at debitis, illo aut, commodi, non illum nam. Lorem ipsum dolor sit amet consectetur, adipisicing elit. Blanditiis, sint ullam error, voluptatibus laborum perspiciatis quo tempora explicabo ad, in vero nam consectetur impedit hic, sapiente doloribus iure consequuntur. Magnam! Lorem ipsum dolor sit amet consectetur adipisicing elit. Commodi est cupiditate in architecto consequatur odit inventore quas. Ipsam error, atque, tempora quaerat perferendis vitae alias distinctio neque, similique, omnis qui. Lorem ipsum, dolor, sit amet consectetur adipisicing elit. Temporibus, consequuntur eum reiciendis illo blanditiis. Animi, at. Temporibus, praesentium quidem aperiam hic consequatur quisquam ad natus assumenda ipsa, nobis cupiditate architecto?</p>
</body>
Вот как этот текст отображается:
Если я правильно понимаю как должна работать эта строка кода
<meta name="viewport" content="width=device-width, initial-scale=1.0">
, то почему тогда viewport (видимая пользователю область веб-страницы, то, что
может увидеть пользователь, не прибегая к прокрутке) не равен ширине устройства и для того, чтобы увидеть весь текст, надо скроллить?