{"record":{"id":"b014f4dd4c265961","repo":"mozilla/pdf.js","slug":"the-container-must-be-absolutely-positioned","errorCode":null,"errorMessage":"The `container` must be absolutely positioned.","messagePattern":"The `container` must be absolutely positioned\\.","errorType":"exception","errorClass":"Error","httpStatus":null,"severity":"error","filePath":"web/pdf_viewer.js","lineNumber":332,"sourceCode":"      throw new Error(\n        `The API version \"${version}\" does not match the Viewer version \"${viewerVersion}\".`\n      );\n    }\n\n    this.container = options.container;\n    this.viewer = options.viewer || options.container.firstElementChild;\n    this.#viewerAlert = options.viewerAlert || null;\n\n    if (typeof PDFJSDev === \"undefined\" || PDFJSDev.test(\"GENERIC\")) {\n      if (this.container?.tagName !== \"DIV\" || this.viewer?.tagName !== \"DIV\") {\n        throw new Error(\"Invalid `container` and/or `viewer` option.\");\n      }\n\n      if (\n        this.container.offsetParent &&\n        getComputedStyle(this.container).position !== \"absolute\"\n      ) {\n        throw new Error(\"The `container` must be absolutely positioned.\");\n      }\n    }\n    this.#resizeObserver.observe(this.container);\n\n    this.eventBus = options.eventBus;\n    this.linkService = options.linkService || new SimpleLinkService();\n    this.downloadManager = options.downloadManager || null;\n    this.findController = options.findController || null;\n    this.#altTextManager = options.altTextManager || null;\n    this.#commentManager = options.commentManager || null;\n    this.#signatureManager = options.signatureManager || null;\n    this.#editorUndoBar = options.editorUndoBar || null;\n\n    if (this.findController) {\n      this.findController.onIsPageVisible = pageNumber =>\n        this._getVisiblePages().ids.has(pageNumber);\n    }\n    this._scriptingManager = options.scriptingManager || null;","sourceCodeStart":314,"sourceCodeEnd":350,"githubUrl":"https://github.com/mozilla/pdf.js/blob/5903d58d58e4dd9ce6ffa3834aea8480f06b4ada/web/pdf_viewer.js#L314-L350","documentation":"Thrown by the PDFViewer constructor (GENERIC build only) when the container element is visible (offsetParent is truthy) but its computed CSS position is not 'absolute'. The viewer positions page views absolutely within the container and requires position:absolute for correct layout.","triggerScenarios":"Container with position:relative/static/fixed, or default static positioning while the element is laid out (offsetParent non-null). Hidden containers (offsetParent null) are exempt.","commonSituations":"Custom CSS overriding the default viewer styles; integrating PDFViewer into a layout framework that sets position:relative; missing the standard pdf.css rules.","solutions":["Set the container to position:absolute (or hide it during init if dynamic).","Include the standard pdf_viewer.css / viewer.css which sets #viewerContainer { position: absolute; }.","If integrating dynamically, set container.style.position = 'absolute' before constructing PDFViewer."],"exampleFix":"// before\n<div id=\"viewerContainer\" style=\"position: relative;\"></div>\n\n// after\n<div id=\"viewerContainer\" style=\"position: absolute; inset: 0;\"></div>","handlingStrategy":"validation","validationCode":"const container = document.querySelector('div#viewerContainer');\nif (container && getComputedStyle(container).position === 'absolute') {\n  new PDFViewer({ container });\n}","typeGuard":null,"tryCatchPattern":null,"preventionTips":["Include the standard pdf_viewer.css that sets container position:absolute.","Avoid layout frameworks that override container positioning.","Set position explicitly before constructing PDFViewer."],"tags":["css","dom","configuration","generic-build"],"backgroundTag":null,"analyzedSha":"5903d58d58e4dd9ce6ffa3834aea8480f06b4ada","analyzedAt":"2026-08-13T02:28:27.364Z","schemaVersion":2},"datasetVersion":"2026-08-13T04:17:16.726Z"}