r - 如何将一个盒子和它的标签放在同一行？ ( Shiny 的包装)

Question

在 Shiny 中，说我正在使用 textInput ，字段/框始终显示在标签下方。有没有办法强制他们在同一行？

即，Label: BOX
代替

Label:

Box

Answer 1

这是一个非常古老的问题，但认为回答它可能对偶然发现此问题的人有用。

添加此 css 有助于在输入旁边实现标签

tags$head(
      tags$style(type="text/css", "label{ display: table-cell; text-align: center; vertical-align: middle; } .form-group { display: table-row;}")
    )

这是一个示例应用程序:

library(shiny)

ui <- fluidPage(

  fluidRow(

    tags$head(
      tags$style(type="text/css", "label{ display: table-cell; text-align: center; vertical-align: middle; } .form-group { display: table-row;}")
    ),

    textInput(inputId = "txtInp", label = "Label:"),
    numericInput(inputId = "numInp", label = "Label:", value = 0)
  )
)

server <- function(input, output){}


shinyApp(ui, server)

应用程序的输出如下:



编辑:
解决 @fiftace 的 仅将其应用于单个输入的评论我已将输入包装在一个带有 id 的 div 中，并将 css 修改为仅应用于该 ID，如下所示:

library(shiny)

ui <- fluidPage(

  fluidRow(

    tags$head(
      tags$style(type="text/css", "#inline label{ display: table-cell; text-align: center; vertical-align: middle; } 
                #inline .form-group { display: table-row;}")
    ),

    tags$div(id = "inline", textInput(inputId = "txtInp", label = "Label:")),
    numericInput(inputId = "numInp", label = "Label:", value = 0)
  )
)

server <- function(input, output){}


shinyApp(ui, server)

有了这个，您的输出如下所示: