{"record":{"id":"436a2e1fc0b4efbc","repo":"Semantic-Org/Semantic-UI","slug":"popup-does-not-fit-within-the-boundaries-of-the-vi","errorCode":null,"errorMessage":"Popup does not fit within the boundaries of the viewport","messagePattern":"Popup does not fit within the boundaries of the viewport","errorType":"console","errorClass":null,"httpStatus":null,"severity":"warning","filePath":"src/definitions/modules/popup.js","lineNumber":1455,"sourceCode":"  // transition settings\n  duration       : 200,\n  transition     : 'scale',\n\n  // distance away from activating element in px\n  distanceAway   : 0,\n\n  // number of pixels an element is allowed to be \"offstage\" for a position to be chosen (allows for rounding)\n  jitter         : 2,\n\n  // offset on aligning axis from calculated position\n  offset         : 0,\n\n  // maximum times to look for a position before failing (9 positions total)\n  maxSearchDepth : 15,\n\n  error: {\n    invalidPosition : 'The position you specified is not a valid position',\n    cannotPlace     : 'Popup does not fit within the boundaries of the viewport',\n    method          : 'The method you called is not defined.',\n    noTransition    : 'This module requires ui transitions <https://github.com/Semantic-Org/UI-Transition>',\n    notFound        : 'The target or popup you specified does not exist on the page'\n  },\n\n  metadata: {\n    activator : 'activator',\n    content   : 'content',\n    html      : 'html',\n    offset    : 'offset',\n    position  : 'position',\n    title     : 'title',\n    variation : 'variation'\n  },\n\n  className   : {\n    active       : 'active',\n    basic        : 'basic',","sourceCodeStart":1437,"sourceCodeEnd":1473,"githubUrl":"https://github.com/Semantic-Org/Semantic-UI/blob/597843ab84d565cccfd8fd7719416350ae73e734/src/definitions/modules/popup.js#L1437-L1473","documentation":"After tentatively placing the popup, the module checks viewport boundaries (popup.js:901-928). It tries alternative positions up to settings.maxSearchDepth; if every position is 'offstage' and settings.lastResort is falsy, it logs error.cannotPlace, removes the loading state, calls onUnplaceable, and returns false (popup.js:918-925). The popup is not shown.","triggerScenarios":"The viewport/scroll container is too small for the popup at every one of the nine positions given the target's location and the popup's size; settings.lastResort is not set; maxSearchDepth is exhausted. Common with large popups, zoomed/very small windows, or targets near screen corners with big popups.","commonSituations":"Long tooltip/HTML popups on mobile; target pinned to a viewport edge; popup inside a tiny scroll container; margin/padding inflating popup size; responsive layouts where the available space collapses.","solutions":["Set settings.lastResort to a valid position so the popup is shown there even if it overflows.","Reduce popup content size or set preferAdjacent:true / adjust distanceAway/offset so a position fits.","Increase settings.maxSearchDepth only if you have custom positions; otherwise enlarge the viewport/scroll container."],"exampleFix":"// before\n$('.btn').popup({ position: 'top center', content: veryLongHtml }); // no fit -> [91]\n\n// after\n$('.btn').popup({\n  position: 'top center',\n  lastResort: 'bottom center',\n  content: veryLongHtml\n});","handlingStrategy":"fallback","validationCode":"// Provide a lastResort so a fit-less popup still shows\n$('.btn').popup({ position: 'top center', lastResort: 'bottom center', content: html });","typeGuard":null,"tryCatchPattern":null,"preventionTips":["Set settings.lastResort to a valid fallback position.","Keep popup content compact for small viewports.","Handle onUnplaceable to inform the user when no position fits."],"tags":["popup","viewport","positioning","semantic-ui","console-error"],"backgroundTag":null,"analyzedSha":"597843ab84d565cccfd8fd7719416350ae73e734","analyzedAt":"2026-08-13T01:44:23.827Z","schemaVersion":2},"datasetVersion":"2026-08-13T04:17:16.726Z"}