Как сделать плавающий блок, чтобы он не выходил за границы экрана?

Question

[Александр]

Подскажите пожалуйста, как сделать так, чтобы блок не выходил за пределы экрана?
Пример
В данном случае блок при уменьшении экрана отталкивается от края, а в моём просто выходит за пределы. Подскажите, как это можно исправить?

Answer 1

[Никита Траторов]

• Если у него абсолютное позиционирование относительно body, можно указать right: 0
  
• Второй вариант, вложить его в прозрачный div, растянутый на весь viewport с position: relative, тогда дочерний элемент не полезет наружу.
  
• JavaScript. Вероятнее всего, на сайте со скриншота именно JS. Кстати, Popover в Bootstrap умеет подыскивать себе удобное местоположение, не уходя за границы экрана
  

Answer 2

[Redrica]

В приведенном примере используется JS (вероятней всего какой-то плагин для поповера).
На странице есть родительский блок для всплывашки, спозиционированный абсолютно от body, при наведении на ссылку внутри этого блока генерируется разметка всплывашки, а ее позиционирование рассчитывается относительно точки наведения.