Vertically align text in reactable cells in shiny app

Question

Is there a way to vertically align (middle) the text in the cells in a reactable rendered within a shiny app?

Minimal example below. I tried some CSS options but no luck so far.

library(shiny)
library(reactable)

ui <- fluidPage(
  titlePanel("reactable example"),
  reactableOutput("table")
)

server <- function(input, output, session) {
  output$table <- renderReactable({
    reactable(iris)
  })
}

shinyApp(ui, server)

Answer 1

You can use defaultColDef to set default attributes. Below code snippet should vertically align text centrally:

library(shiny)
library(reactable)

ui <- fluidPage(
    titlePanel("reactable example"),
    reactableOutput("table")
)



server <- function(input, output, session) {
    output$table <- renderReactable({
        reactable(iris, 
                  defaultColDef = colDef(
                      align = "center")
                  )
    })
}

shinyApp(ui, server)

Below is the output after running the code. The output is both centrally & horizontally aligned