Обнаружение переполнения в элементах DIV

В этой статье мы углубимся в вопрос о том, как определить вертикальное переполнение текста в настройке CSS и HTML

. ]

Рассмотрим следующий код CSS и HTML:

div.rounded { фон — цвет: #FFF; высота: 123 пикселей; ширина: 200 пикселей; размер шрифта: 11 пикселей; переполнение: скрыто; }

div.rounded {
  background-color: #FFF;
  height: 123px;
  width: 200px;
  font-size: 11px;
  overflow: hidden;
}

  Lorem ipsum dolor sit amet,
  consectetur adipiscing elit. Phasellus vel quam vestibulum orci blandit laoreet.

Чтобы проверить, не переполнен ли текст элемента DIV, можно использовать JavaScript. Следующий скрипт сравнивает ScrollHeight элемента с его clientHeight:

function GetContainerSize() { вар контейнер = document.getItemById("tempDiv"); вар сообщение = «Ширина содержимого с отступом: контейнер.scrollWidth "пикс.\n"; сообщение = «Высота содержимого с отступом: контейнер.scrollHeight "пикс.\n"; предупреждение (сообщение); }

function GetContainerSize() {
  var container = document.getElementById("tempDiv");
  var message =
    "The width of the contents with padding: "  
    container.scrollWidth  
    "px.\n";
  message  =
    "The height of the contents with padding: "  
    container.scrollHeight  
    "px.\n";

  alert(message);
}

Для получения дополнительной информации по этой теме обратитесь к следующему сценарию:

[Overflow Документация](http://help.dottoro.com/ljbixkkn.php)