<!DOCTYPE html>
<html>
<head>
<title>Заголовок документа</title>
<style>
div.scroll {
background-color: #ccc;
width: 50px;
overflow-x: scroll;
}
div.hidden {
background-color: #ccc;
width: 50px;
overflow: hidden;
}
div.auto {
background-color: #ccc;
width: 50px;
overflow: auto;
}
div.visible {
background-color: #ccc;
width: 50px;
overflow: visible;
}
</style>
</head>
<body>
<h2>Пример свойства overflow-x</h2>
<h3>overflow-x: scroll</h3>
<div class="scroll">Lorem Ipsum - это текст-"рыба", часто используемый в печати и вэб-дизайне.</div>
<h3>overflow-x: hidden</h3>
<div class="hidden">Lorem Ipsum - это текст-"рыба", часто используемый в печати и вэб-дизайне.</div>
<h3>overflow-x: auto</h3>
<div class="auto">Lorem Ipsum - это текст-"рыба", часто используемый в печати и вэб-дизайне.</div>
<h3>overflow-x: visible</h3>