Hi, I am not a dev but I need to position a popup. I found what I need here: https://www.w3schools.com/css/css_positioning.asp I need the to position my popup as in the last link under section "position: absolute"...
div.relative {
position: relative;
width: 400px;
height: 200px;
border: 3px solid #73AD21;
}
div.absolute {
position: absolute;
top: 80px;
right: 0;
width: 200px;
height: 100px;
border: 3px solid #73AD21;
}
The problem is that someone gave me the code bellow and it´s just 1 div, I think I need to created 2 div from it as it´s above but as I am not a dev I donot know how to do it. Bellow is my code...
If anyone could modify it in order for my popup to be ´position: absolute´ i would appreciate!
Thanks in advance!
Popup content....
//
My code... <img
My code...
<img class="img-responsive atto_image_button_text-bottom" onclick="showcontent1()" src="https:.../infopng-b.png?time=1607298509862" alt="" width="31" height="31" role="presentation"> <p></p> <p></p> <p></p> <p></p> <p><br><br></p> <p></p> <div id="contnt-img-1" class="tooltip-content" style="display: none; border: 4px solid orange; width: 380px; top: 88%; right: 17%; position: absolute; background-color: #fff; padding: .5em;"><button id="close-cnt1 " style="position: relative; background: none; border: none; top: -5px; right: -5px;" onclick="closecontent1(); return false; "> X </button> <p>Popup content....</p> </div> <script type="text/javascript"> // <![CDATA[ function showcontent1() { document.getElementById('contnt-img-1').style.display = 'block'; } function closecontent1() { document.getElementById('contnt-img-1').style.display = 'none'; return false; } // ]]> </script>