Im trying to put the header of the shiny widget next to it like in this answer but unfortunatelly it does not work and see no change. Anybody else facing the same issue?
library(shiny)
runApp(list(ui = pageWithSidebar(
headerPanel("side-by-side"),
sidebarPanel(
tags$head(
tags$style(type="text/css", "label.control-label, .selectize-control.single{ display: inline-block!important; }")
),
selectInput(inputId = "options", label = "dropdown dox:",
choices = list(a = 0, b = 1))
),
mainPanel(
h3("bla bla")
)
)
, server = function(input, output) { NULL })
)
Yes, your code is not working. You can adjust the CSS to make it work. However, you need to play with the numbers (font size, width, etc) as required in your case. Try this
library(shiny)
css <-
"
.container {
margin: 20px;
padding: 15px;
}
#expr-container .selectize-input {
font-size: 44px;
line-height: 44px;
width: 300px;
}
#expr-container .selectize-dropdown {
font-size: 16px;
line-height: 22px;
}
#expr-container .selectize-dropdown-content {
max-height: 225px;
padding: 0;
}
#expr-container .selectize-dropdown-content .option {
border-bottom: 1px dotted #ccc;
}
#expr-container label{
display: table-cell;
text-align: center;
vertical-align: middle;
}
#expr-container .form-group {
display: table-row;
}
"
ui <- fluidPage(
headerPanel("side-by-side"),
sidebarPanel(
tags$style(css),
fluidRow(
tags$div(id = "expr-container", selectInput(inputId = "options", label = "Select Me: ",
choices = list(aaaaaa = 0, bbbbbb = 1),
multiple = FALSE, selectize = TRUE #, width = "60%"
) )
)
),
mainPanel(
h3("bla bla")
)
)
server <- function(input, output){}
shinyApp(ui, server)
EDIT : add color
#expr-container .selectize-input {
font-size: 44px;
line-height: 44px;
color: blue;
border-color: red;
width: 300px;
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.