Display buttons side-by-side in shiny

Hi,

I am working on a fairly complex shiny app in which I need to create buttons independently prior to be displayed (to avoid non-desired cross-interactivity). Note that I cannot avoid but to create these buttons objects using separate renderUI() calls. I created a simple reprex below. I would like to display the buttons 1 and 2 side by side, like the buttons 3 and 4 . I would also like to avoid placing each button in a column (spacing would be relative instead of absolute). Any suggestion would be welcome.

Thanks



library(shiny)

ui <- fluidPage(
  uiOutput('btns') ,
  actionButton("3", "3"),
  actionButton("4", "4")
)

server <- function(input, output){

  output$btn1 <- renderUI({
    actionButton("1", "1")
  })
  output$btn2 <- renderUI({
    actionButton("2", "2")
  })
  output$btns <- renderUI({
    fluidRow(
      uiOutput('btn1'),
      uiOutput('btn2')
    )
  })
}

shinyApp(ui, server)

You can set the display to be inline-block. For this example, I also added margin-left to the first button to have them align with buttons 3 and 4.

fluidRow(
      uiOutput('btn1', style = 'display: inline-block; margin-left: 15px;'),
      uiOutput('btn2', style = 'display: inline-block;')
    )

image

Beautiful!

Thanks @scottyd22

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

If you have a query related to it or one of the replies, start a new topic and refer back with a link.