Я разрабатываю кросс-браузерное расширение (дополнение), которое находится на правой стороне каждой страницы.Прямо сейчас я накладываю боковую панель вверху каждой страницы.Но я бы предпочел, чтобы он располагался по бокам каждой страницы сам по себе, не скрывая ни одной части родительской страницы.Я безуспешно искал ответ на этот вопрос.Кажется, есть встроенные методы для создания боковых панелей в некоторых браузерах .Но я ищу технику, которая включает только html и css (и jquery, если необходимо).
В качестве примера того, что я ищу, расширение Google Related находится внизу каждой страницы, нофактически загружает содержимое страницы при загрузке.
![enter image description here](https://i.stack.imgur.com/sKIT4.jpg)
Надстройка Widgya является частью содержимого родительской страницы, и вы можете увидеть, как Google Related подталкивает ее, чтобы избежатьвторжение на страницу.Это соответствующий HTML-код из Связанного расширения:
<div style="clear: both; height: 46px; width: 100%; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; position: relative; "></div>
<iframe class="grelated-iframe" frameborder="0" id="grelated_iframe_189" src="http://www.gstatic.com/webgps/grelated_0_6_9/html/grelated_bar_iframe.html" style="z-index: 2147483647; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; outline-width: 0px; outline-style: initial; outline-color: initial; vertical-align: baseline; position: fixed; bottom: 0px; left: 0px; right: 0px; top: auto; width: 100%; height: 49px; " scrolling="no"></iframe>
Используя div, который вызывает 'clear: both', и iframe, который является абсолютно позиционным, эффект достигается.Но я не могу воспроизвести этот эффект на правой или левой стороне экрана.Я пробовал разные методы, но безуспешно.Буду признателен за понимание подхода.
Спасибо
Обновление:
Вот эффект, которого я пытаюсь достичь:
![enter image description here](https://i.stack.imgur.com/qGqCR.png)
Chrome имеет / имел экспериментальный API боковой панели, но мне нужна возможность сделать это в css & html, не полагаясь на API для конкретного браузера.