在 Shiny 中，absolutePanel 默认相对于视口（window）定位，若需使其相对于某个父容器定位，必须确保该父元素的 CSS position 属性被显式设为 relative（或 absolute/fixed），而不能通过 R 的 position = "relative" 参数实现——该参数无效，须改用 style = "position: relative;"。
在 shiny 中，`absolutepanel` 默认相对于视口（window）定位，若需使其相对于某个父容器定位，必须确保该父元素的 css `position` 属性被显式设为 `relative`（或 `absolute`/`fixed`），而不能通过 r 的 `position = "relative"` 参数实现——该参数无效，须改用 `style = "position: relative;"`。
absolutePanel 的行为严格遵循 CSS 定位规范：它会查找最近的、非 static 定位的祖先元素作为参考系。Shiny 的 div() 函数不支持 position 作为命名参数（如 position = "relative"），该写法会被忽略，导致父容器仍保持默认 position: static，从而使 absolutePanel 回退至全局视口定位。
✅ 正确做法是：通过 style 参数注入标准 CSS 声明。以下为修复后的完整代码示例：
tabPanel(
"Activity map",
div(
style = "position: relative;", # ✅ 关键修正：使用 style 而非 position 参数
div(
class = "outer",
tags$style(type = "text/css",
"#map { height: calc(100vh - 110px) !important; }"),
leafletOutput("map")
),
absolutePanel(
top = "100px", # 推荐使用带单位的字符串（如 "100px" 或 "5%"）
left = "85px",
width = "320px",
height = "auto",
fixed = FALSE, # ⚠️ 注意：fixed = TRUE 会使面板脱离文档流并固定于视口，通常应设为 FALSE
style = "padding: 15px; background: rgba(232, 232, 232, 0.8); bottom: 25px;",
div(
style = "margin-bottom: 15px;",
h6("Activity map"),
p("This map helps to get an overview of the spatial and temporal dimension of UN peacekeeping activities...")
)
)
)
)
? 关键要点总结：
- div(position = "relative") ❌ 无效 —— position 不是 div() 的合法 R 参数；
- div(style = "position: relative;") ✅ 唯一有效方式；
- absolutePanel(fixed = TRUE) 会强制相对于视口定位，与父容器无关，故绝大多数场景下应设为 fixed = FALSE（默认值）；
- top/left 等值建议显式带单位（如 "100px"），避免隐式解析歧义；
- 可通过浏览器开发者工具（Elements 面板）检查生成的 HTML，确认父 div 是否确实含有 style="position: relative;"。
完成上述调整后，absolutePanel 将精准依据 .outer 同级的相对定位父容器进行偏移计算，完美覆盖地图区域并随窗口缩放自适应。
