@SempervivumMar 08.2022 — #You can check if the menu exceeds the right edge of the body by creating a bounding box for menu and body. Then compare the property `right</C> of both: <CODE>`<i> </i> function popup(menuCell, id) { menuCell.appendChild(menu); // remove class "stick-right": menu.classList.remove('stick-right'); const // get bounding box of menu and body: boxMenu = menu.getBoundingClientRect(), boxBody = document.querySelector('body').getBoundingClientRect(); console.log(boxMenu.left, boxMenu.right, boxBody.left, boxBody.right); // does the menu exceed the right edge of the body? if (boxMenu.right > boxBody.right) { // add class "stick-right" in order to make the menu // stick to the right edge of the body menu.classList.add('stick-right'); } // make menu visible: menu.classList.remove('hide'); }<i> </i>`` I added some modifications to the CSS in order to make this work.
Note that li elements cannot be children of a div, it has to be an ul element.