Absolute panel collision with r shiny dashboard sidebar panel

Question

I'm trying to add absolutePanel to my shiny dashboard app. I want the panel to be at the bottom of the page with the width of the window and adjust to it when the sidebar is visible or not. The problem is that when the sidebar is opened some of the panel is not visible:

On the other hand if I set the width from the left side of a panel and close the sidebar it's far from the left end of the window:

Here is a reproducible code:

## app.R ##
library(shiny)
library(shinydashboard)

ui <- dashboardPage(
  dashboardHeader(),
  dashboardSidebar(),
  dashboardBody(
    absolutePanel(
      bottom = 0, left = 0, right = 0, # or left = 300
      fixed = TRUE,
      wellPanel(
        style = "padding: 8px; border-bottom: 1px solid #CCC; background: #FFFFEE;",
        HTML("Save changes?"),
        actionButton("save", "Save"),
        actionButton("cancel", "Cancel")
      )
    )
  )
)

server <- function(input, output) { }

shinyApp(ui, server)

Answer 1

Try removing absolutePanel with div that it produces with added high enough z-index to style:

library(shiny)
library(shinydashboard)

ui <- dashboardPage(
  dashboardHeader(),
  dashboardSidebar(),
  dashboardBody(
    div(
      style = "left:0px; right:0px; bottom:0px; position:fixed; cursor:inherit; z-index: 10000;",
      wellPanel(
        style = "padding: 8px; border-bottom: 1px solid #CCC; background: #FFFFEE;",
        HTML("Save changes?"),
        actionButton("save", "Save"),
        actionButton("cancel", "Cancel")
      ) 
    )
  )
)

server <- function(input, output) { }

shinyApp(ui, server)