I have the below code to display the widgets inline(in same row) in shiny
div(style="display:inline-block; width: 150px;height: 75px;",selectInput("ddllgra", "Function:",c('mean','median','sd','count','min','max'), selected='mean')), div(style="display:inline-block; width: 150px;height: 75px;",textInput(inputId="xlimitsmax", label="x-max", value = 0.5))
It is coming out in UI, but not in the same line order. one in coming in the upper side and other is coming on the lower side one the same line.
Is there a way to correct this misalignment?
Add vertical-align:top
to your style
rm(list = ls()) library(shiny) ui <- fluidPage( sidebarPanel( div(style="display: inline-block;vertical-align:top; width: 150px;",selectInput("ddllgra", "Function:",c('mean','median','sd','count','min','max'), selected='mean')), div(style="display: inline-block;vertical-align:top; width: 150px;",textInput(inputId="xlimitsmax", label="x-max", value = 0.5))), mainPanel() ) server <- shinyServer(function(input,output){}) shinyApp(ui, server)
Edit: How to add space between the divs
You can use the same approach: Example below has 100px
between the divs
rm(list = ls()) library(shiny) ui <- fluidPage( sidebarPanel( div(style="display: inline-block;vertical-align:top; width: 150px;",selectInput("ddllgra", "Function:",c('mean','median','sd','count','min','max'), selected='mean')), div(style="display: inline-block;vertical-align:top; width: 100px;",HTML("<br>")), div(style="display: inline-block;vertical-align:top; width: 150px;",textInput(inputId="xlimitsmax", label="x-max", value = 0.5))), mainPanel() ) server <- shinyServer(function(input,output){}) shinyApp(ui, server)
You should create a fluidPage
with a fluidRow
and then use the column
function.
fluidPage(fluidRow( column(2, selectInput()), column(1, selectInput()), column(2, textInput()) ) )
More detail, look up fluidPage
,fluidRow
and column
within shiny function references.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With