Reputation: 85
I use pickerInput from shinyWidget
div(class = "choosechannel",
pickerInput(inputId = "choosechannel", label = "business channel", width = "150px",
choices = c("In-Branch", "Agency", "Affinity", "Corporate", "Credit Life"),
multiple = TRUE, selected = c("In-Branch", "Agency", "Affinity", "Corporate", "Credit Life"),
options = list(height = 10)))
I want to change the height of pickerInput Here are the codes that I have tried to use:
tags$style(".choosechannel-button {height: 26.5px; min-height: 26.5px; padding: 0px;}")
tags$head( tags$style( HTML("#choosechannel-button {font-size: 13px; height: 26.5px; min-height: 26.5px;}")))
tags$style(".choosechannel-container {height: 26.5px; min-height: 26.5px; padding: 0px;}")
tags$head( tags$style( HTML("#choosechannel-container {font-size: 13px; height: 26.5px; min-height: 26.5px;}")))
None of them works. Does anyone know how to do it?
edit :
I've tried .choosechannel .btn {height: 26.5px; font-size: 13px;}
within tags$style, as suggested by Wilmar van Ommeren in his answer. It almost work. It still has white space underneath it.
It looks like this:
Upvotes: 4
Views: 1992
Reputation: 7699
You are almost there. What you want is to change the .btn
class in your .choosechannel
class. You can point to a class inherited by another class by using a dot (.choosechannel .btn {...}
).
library(shiny)
library(shinyWidgets)
ui <- fluidPage(
tags$style(".choosechannel .btn {height: 26.5px; min-height: 26.5px; padding: 0px;}"),
div(class = "choosechannel",
pickerInput(inputId = "choosechannel", label = "business channel", width = "150px",
choices = c("In-Branch", "Agency", "Affinity", "Corporate", "Credit Life"),
multiple = TRUE, selected = c("In-Branch", "Agency", "Affinity", "Corporate", "Credit Life"),
options = list(height = 10)))
)
server <- function(input, output, session) {
}
shinyApp(ui, server)
Upvotes: 3