如何消除Shiny中FluidRows之间的顽固空白？

Question

I have two fluidRows in a column of my UI in Shiny.

I want the top row to have a slight space above it, but I want to eliminate any space between the rows .

• I've tried div , tags , and an assortment of style arguments like margin: 0px and padding: 0px ... , but I can't get the spacing to act accordingly.

  • Here's an example:

     ui <- fluidPage( fluidRow( column(1,offset=0, div(style = "font-size: 10px; padding: 14px 0px; margin:0%", fluidRow( sliderInput(inputId = "sizeSlide", label = "Sizing", value = 10, min = 1,max = 20) ) ), div(style = "font-size: 10px; padding: 0px 0px; margin:0px", fluidRow( radioButtons(inputId = "greatORless", label = "DBH Limiter", choices = c(">", "<"), selected = ">") ) ) ) ) ) 

What I get is this:

^{(Notice the large [unwanted] space between rows)}

What I want is this:

^{(Notice the significantly smaller space between rows)}

How do I do this??

Answer 1

You can use negative values on margin , in this case use margin-top:-2em to affect only the top margin. I prefer to use relative units, but you can use pixel instead of em .

library(shiny)
ui <- fluidPage(
fluidRow(
column(1,offset=0,
       div(style = "font-size: 10px; padding: 14px 0px; margin:0%",
           fluidRow(
             sliderInput(inputId = "sizeSlide", label = "Sizing", value = 10, min = 1,max = 20)
           )
       ),
       div(style = "font-size: 10px; padding: 0px 0px; margin-top:-2em", 
           fluidRow(
             radioButtons(inputId = "greatORless", label = "DBH Limiter", choices = c(">", "<"), selected = ">")
           )                                      
       )
    )
  )
)

shinyApp(ui = ui, server = server)