R Shiny-对齐表单组输入

Question

我有一个包含两个输入的表单组。每个“输入”包括一个包含开关的div和一个数字输入，其输入标签显示在div的左侧。

我设法使标签出现在LHS上，但是在垂直对齐开关和数字输入时遇到了麻烦，如下所示：

以下是重现该框的代码：

library(shiny)
library(shinydashboard)
library(shinyWidgets)

ui <- dashboardPage(
  dashboardHeader(),
  dashboardSidebar(),
  dashboardBody(
    tags$style("
                    .input-field label { 
                    display: table-cell; 
                    text-align: left; 
                    vertical-align: top;
                    clear: left;
                    padding-right: 8px
                    }

                    .input-field .form-group { 
                    display: table-row;
                    }


                    "),
    fluidRow(

      box(width = 6, title = "Box 1", status = "primary", solidHeader = TRUE,
          tags$div(class = "input-field", 

                   div(class = "form-group",
                       tags$label("Input 1:", `for` = "input1"),
                       div(id = "input1", 
                           prettySwitch("add1", "Add", slim = T, status = "primary"),
                           numericInput("value1", "", value = 100)
                           ),

                       tags$label("Input 2:", `for` = "input2"),
                       div(id = "input2", 
                           prettySwitch("add2", "Add", slim = T, status = "primary"),
                           numericInput("value2", "", value = 100)
                           )
                       )
                   )
          )

      )
    )
  )


server <- function(input, output) {}

shinyApp(ui, server)

我该如何垂直对齐开关和数字输入框，以使数字输入直接位于开关下方？

我也不知道是什么原因导致输入2出现在输入1的旁边，我希望它出现在输入1的下方，并且标签与输入字段右对齐，例如

编辑：我通过遵循此处给出的解决方案来修正对齐方式：Shiny: Label position, textInput。结果如下：

更新的代码：

library("shiny")

ui <- fluidPage(tags$head(tags$style("

                                     .param .form-group {
                                     margin-bottom: 4px;
                                     }

                                     [for *= 'value'] {
                                     display: none;
                                     }

                                     ")),

  fluidRow(
    column(

      width = 4,

      tags$form(
        class="form-horizontal",

        tags$div(
          class="param form-group",
          tags$label(class = "col-sm-4 control-label", `for` = "add1", "Population"),
          column(width = 4,
                 prettySwitch("add1", "Add", slim = T, status = "primary"),
                 numericInput(inputId = "value1", label = "", value = "15"))
        )

      )
    )
  )

)

server <- function(input, output) {

}

shinyApp(ui = ui, server = server)