Horizontal hr () rule in R Shiny Sidebar

Question

You can usually create a horizontal rule below the interface elements with hr() when using fluidRow() in Shiny, but you cannot do this in the text sideBarPanel() . How can I make a horizontal rule or something similar to separate text and user interface elements in the sidebar?

Answer 1

In general, the line is visible, but with very low contrast with the background. To make the line more visible, you can change the CSS code by including the following in the ui part:

  tags$head( tags$style(HTML("hr {border-top: 1px solid #000000;}")) ), 

with tags$style(HTML(...)) you can incorporate CSS into your application. Html tag for hr string. And the remaining parameter indicates the specification of selecting a line, width, color, etc.

A complete working example is given below:

 library(shiny) ui <- fluidPage( tags$head( tags$style(HTML("hr {border-top: 1px solid #000000;}")) ), sidebarLayout( sidebarPanel( "text", hr(), uiOutput("out") ), mainPanel( plotOutput("distPlot") ) ) ) server <- function(input, output) { output$out <- renderUI({ sliderInput("bins", "Number of bins:", min = 1, max = 50, value = 30) }) } shinyApp(ui = ui, server = server)