如下面兩張圖所示，我想要在網頁上的某個位置固定彈出視窗

圖一是網頁一進去的樣子，天藍色部分是他的工具列跟側邊欄位，白色部分則是用 iframe 內嵌網頁進去，

今天在三個點的部分想要做出點擊一下後，用 toggle 的方式下滑出一個列印或下載的 div（紅框），

目前我是使用 absolute 定位，而這種定位方式當我把視窗縮小時，並不會有 RWD 的效果。

以下是我的 html 及 css code，請各位大神指教：

<div class="download-Print elevation-4" id="more1">
    <div class="UserData-body">
        <a href="#"><p id="userdata"><i class="fas fa-user-edit"></i>下載</p></a>
        <a href="#"><p id="userdata"><i class="fas fa-user-cog"></i>列印</p></a>
    </div>
</div>

<script>
$(".more1").click(function() {
    event.preventDefault();
    $('#more1').slideToggle(400);
});
</script>

.download-Print{
    display: none;
    position: absolute;
    top: 21%;
    right: 36%;
    background: rgb(167, 167, 167);
    z-index: 1000;
    width: 120px;
    padding: 1% 2%;
    border-radius: 10px;
}