{"record":{"id":"39c52656254677e9","repo":"Semantic-Org/Semantic-UI","slug":"sticky-element-must-be-inside-a-relative-container","errorCode":null,"errorMessage":"Sticky element must be inside a relative container","messagePattern":"Sticky element must be inside a relative container","errorType":"console","errorClass":null,"httpStatus":null,"severity":"warning","filePath":"src/definitions/modules/sticky.js","lineNumber":960,"sourceCode":"  onReposition   : function(){},\n\n  // Called on each scroll\n  onScroll       : function(){},\n\n  // Called when element is stuck to viewport\n  onStick        : function(){},\n\n  // Called when element is unstuck from viewport\n  onUnstick      : function(){},\n\n  // Called when element reaches top of context\n  onTop          : function(){},\n\n  // Called when element reaches bottom of context\n  onBottom       : function(){},\n\n  error         : {\n    container      : 'Sticky element must be inside a relative container',\n    visible        : 'Element is hidden, you must call refresh after element becomes visible. Use silent setting to surpress this warning in production.',\n    method         : 'The method you called is not defined.',\n    invalidContext : 'Context specified does not exist',\n    elementSize    : 'Sticky element is larger than its container, cannot create sticky.'\n  },\n\n  className : {\n    bound     : 'bound',\n    fixed     : 'fixed',\n    supported : 'native',\n    top       : 'top',\n    bottom    : 'bottom'\n  }\n\n};\n\n})( jQuery, window, document );\n","sourceCodeStart":942,"sourceCodeEnd":978,"githubUrl":"https://github.com/Semantic-Org/Semantic-UI/blob/597843ab84d565cccfd8fd7719416350ae73e734/src/definitions/modules/sticky.js#L942-L978","documentation":"Semantic UI Sticky error message stating the sticky element must live inside a relatively-positioned container. Note: in this build the throw site is commented out (sticky.js:401 //module.error(error.container,...)), so the message is defined but not actively emitted at runtime; the underlying requirement still stands - sticky positioning needs a positioned ancestor.","triggerScenarios":"Conceptually fires when the sticky element's parent/container is statically positioned (position:static). Because the throw site is commented out in this source, the message will generally not appear; instead the symptom is a sticky element that misbehaves (jumps, doesn't pin).","commonSituations":"Wrapping .ui.sticky inside a default-flow div without position:relative; converting a layout to flex/grid without re-adding position:relative on the container; CSS resets that strip position from ancestors.","solutions":["Add position:relative to the sticky element's container (the element referenced by settings.context, or the immediate parent).","Confirm settings.context points to an element that is or can be made position:relative.","If you rely on this message at runtime, note it is disabled in this build - rely on visual debugging instead."],"exampleFix":"// before\n<div>\n  <div class=\"ui sticky\">...</div>\n</div>\n// after\n<div style=\"position:relative\">\n  <div class=\"ui sticky\">...</div>\n</div>","handlingStrategy":"validation","validationCode":"function ensureRelativeContainer($sticky) {\n  var $parent = $sticky.parent();\n  if ($parent.css('position') === 'static') {\n    $parent.css('position', 'relative');\n  }\n}","typeGuard":"function hasPositionedAncestor($el) {\n  var p = $el.parent();\n  while (p && p.length) {\n    var pos = p.css('position');\n    if (pos === 'relative' || pos === 'absolute' || pos === 'fixed') return true;\n    p = p.parent();\n    if (p.is('body')) break;\n  }\n  return false;\n}","tryCatchPattern":null,"preventionTips":["Always set position:relative on the sticky element's container.","Point settings.context at an element you control the positioning of.","Note the runtime check is commented out in this build - rely on visual debugging."],"tags":["semantic-ui","sticky","css-positioning","configuration"],"backgroundTag":null,"analyzedSha":"597843ab84d565cccfd8fd7719416350ae73e734","analyzedAt":"2026-08-13T01:44:23.827Z","schemaVersion":2},"datasetVersion":"2026-08-13T04:17:16.726Z"}