渲染带有Webshot的图像时避免重叠

Question

我正在尝试将元素移开，以使渲染的图像不与任何东西重叠（尝试动态地进行操作，以使任何尺寸的页面都适合并且只是将所有内容推开了）...很新整个事情。预先谢谢你！

library(shiny)

library(webshot)

ui <- fluidPage(
  titlePanel(
    fluidRow ( align = "center", h3("Screens"))
  ),

  sidebarLayout(
    #Side panel lay out to include variant, gene and disease info relevant to interpretation
    sidebarPanel(width=3,
                 h5("Screens")),


    mainPanel(
      textInput("screen1", h5("Screenshot1"), 
                value = "http://example.com/", width = "100%", placeholder = NULL),

      imageOutput("screen1"),

      textInput("screen2", h5("Screenshot2"), 
                value = "http://example.com/", width = "100%", placeholder = NULL),

      imageOutput("screen2")
    )))

server <- function(input, output, session) {

output$screen1 <- renderImage({
  webshot(input$screen1, zoom = 1, 
          file = "screen1.png") 
  list(src = "screen1.png",
       contentType = 'image/png')
})

output$screen2 <- renderImage({
  webshot(input$screen2 , zoom = 1, 
          file = "screen2.png") 
  list(src = "screen2.png",
       contentType = 'image/png')

})

}

shinyApp(ui = ui, server = server)