diff --git a/packages/primevue/src/confirmpopup/ConfirmPopup.vue b/packages/primevue/src/confirmpopup/ConfirmPopup.vue index bb8c4d62b..9464ba3aa 100644 --- a/packages/primevue/src/confirmpopup/ConfirmPopup.vue +++ b/packages/primevue/src/confirmpopup/ConfirmPopup.vue @@ -206,7 +206,7 @@ export default { arrowLeft = targetOffset.left - containerOffset.left; } - this.container.style.setProperty($dt('overlay.arrow.left').name, `${arrowLeft}px`); + this.container.style.setProperty($dt('confirmpopup.arrow.left').name, `${arrowLeft}px`); if (containerOffset.top < targetOffset.top) { this.container.setAttribute('data-p-confirmpopup-flipped', 'true'); diff --git a/packages/primevue/src/confirmpopup/style/ConfirmPopupStyle.js b/packages/primevue/src/confirmpopup/style/ConfirmPopupStyle.js index c6565d46e..1713be9b2 100644 --- a/packages/primevue/src/confirmpopup/style/ConfirmPopupStyle.js +++ b/packages/primevue/src/confirmpopup/style/ConfirmPopupStyle.js @@ -67,7 +67,7 @@ const theme = ({ dt }) => ` .p-confirmpopup:after, .p-confirmpopup:before { bottom: 100%; - left: ${dt('confirmpopup.arrow.offset')}; + left: calc(${dt('confirmpopup.arrow.offset')} + ${dt('confirmpopup.arrow.left')}); content: " "; height: 0; width: 0; diff --git a/packages/primevue/src/popover/style/PopoverStyle.js b/packages/primevue/src/popover/style/PopoverStyle.js index 3df4aef77..a2f834c9e 100644 --- a/packages/primevue/src/popover/style/PopoverStyle.js +++ b/packages/primevue/src/popover/style/PopoverStyle.js @@ -39,7 +39,7 @@ const theme = ({ dt }) => ` .p-popover:after, .p-popover:before { bottom: 100%; - left: ${dt('popover.arrow.offset')}; + left: calc(${dt('popover.arrow.offset')} + ${dt('popover.arrow.left')}); content: " "; height: 0; width: 0;