Resize absolute panel and text inside it on different screens (Desktop, Laptop, Mobile)

My shiny application has different absolute panels, but their appearance is different on different screens. In particular, I noticed that the size of the panel and the text inside it, usually present inside h() tags) are always the same, while some widget (as actionButtons) are automatically resized. Here is a minimal reproducible example with an absolutePanel that is supposed to appear in the middle of the screen:

library(shiny)

ui <- fluidPage(

  absolutePanel(id = "initial_panel",
                fixed = TRUE,
                top = 0,
                left = 0,
                bottom = 0,
                right = 0,
                width = 900,
                height = 450,
                style = "background-color: white;
  	                     opacity: 0.85;
  	                     padding: 20px 20px 20px 20px;
  	                     margin: auto;
  	                     border-radius: 5pt;
  	                     box-shadow: 0pt 0pt 6pt 0px rgba(61,59,61,0.48);
                         padding-bottom: 2mm;
                         padding-top: 1mm;",
                
                fluidRow(
                  column(width = 12,
                         align = "center",
                         h1(strong("Welcome!"))
                  )
                ),
                fluidRow(
                  column(width = 12,
                         align = "center",
                         h3("Some more text")
                  )
                ),
                
                br(),
                
                fluidRow(
                  column(width = 12,
                         align = "center",
                         actionButton(inputId = "explore",
                                      label = icon(name = "times",
                                                   class = "fa-2x",
                                                   lib = "font-awesome")
                         )
                  )
                )
  )

)

server <- function(input, output, session) {
  
}
  
shinyApp(ui, server)

If from my desktop I switch to the laptop, this panel takes almost the 60% of the screen size (so it's too big). Any suggestion on how to deal with this?

Thanks!

1 Like

This topic was automatically closed 54 days after the last reply. New replies are no longer allowed.