Пример CSS свойство overflow-x со всеми значениями

Source Code: (back to article)

<!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>
    <div class="visible">Lorem Ipsum - это текст-"рыба", часто используемый в печати и вэб-дизайне.</div>
  </body>
</html>