CODEWITHSUNDEEP
cssrshiny
ismirsehregal
ismirsehregal

Reputation: 33550

Changing the distance between the label text and a selectizeInput element in R Shiny?

I’m looking for a way to adjust the label space on selectizeInput elements in a Shiny app. The different spacing is a result of inserting a checkbox to the label.

I already found a hint here, but this only helps little. Here is an example:

library(shiny)

    ui <- fluidPage(
  tags$head(
    tags$style(HTML(
      "label { margin-bottom: 0px; }"
    ))
  ),
  fluidRow(
    column(2,
           selectizeInput("S1", label = checkboxInput(inputId = "chk1", label = p('Test - ', strong('Test:'))), c("A","B")),
           selectizeInput("S2", label = checkboxInput(inputId = "chk2", label = div(icon("filter"), strong('Test:'))), c("A", "B")),
           selectizeInput("S3", "Test:", c("A", "B")),
           selectizeInput("S4", "Test:", c("A", "B"))
    )))

server <- function(input, output){}

shinyApp(ui = ui, server = server)

This is the result: result

Thanks!

Upvotes: 3

Views: 936

Answers (1)

SeGa
SeGa

Reputation: 9809

I think that should do it.

library(shiny)

ui <- fluidPage(
  tags$head(
    tags$style(HTML(
       ".checkbox {margin: 0}
        .checkbox p {margin: 0;}
        .shiny-input-container {margin-bottom: 0;}
       "
    ))
    # inlineCSS(".checkbox margin: 0;")
  ),
  fluidRow(
    column(2,
           selectizeInput("S1", label = checkboxInput(inputId = "chk1", label = p('Test - ', strong('Test:'))), c("A","B")),
           selectizeInput("S2", label = checkboxInput(inputId = "chk2", label = div(icon("filter"), strong('Test:'))), c("A", "B")),
           selectizeInput("S3", "Test:", c("A", "B")),
           selectizeInput("S4", "Test:", c("A", "B"))
    )))

server <- function(input, output){}

shinyApp(ui = ui, server = server)

Upvotes: 3

Related Questions