闪亮的CSS:在shinydashboard侧边栏中对齐actionButtons

前端之家收集整理的这篇文章主要介绍了闪亮的CSS:在shinydashboard侧边栏中对齐actionButtons前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

我试图在shinydashboard侧边栏中放置一些actionButtons,并且需要将它们设置为在侧边栏中居中并在分配给它们的空间内水平分布.

这是一个MWE:

library(shiny)
library(shinydashboard)

foo_body = dashboardBody()
foo_header = dashboardHeader()
foo_sidebar = dashboardSidebar(
  sidebarMenu(
    menuItem(
      "A Dashboard",tabName = "tab_overview",icon = icon("gamepad")  
    )
  ),# add some buttons
  actionButton(inputId = "button1",label = "B 1",icon = icon("paper-plane")),actionButton(inputId = "button2",label = "B 2",actionButton(inputId = "button3",label = "B 3",icon = icon("paper-plane"))
)

foo_page = dashboardPage(
  header = foo_header,sidebar = foo_sidebar,body = foo_body,title = "A Dashboard"
)

shinyApp(
  ui = foo_page,server = function(input,output) {}
)

以下是我需要重新设计的应用程序的相关部分:

enter image description here

任何一般或具体的想法都会受到欢迎.

最佳答案
您可以为按钮添加样式,如此.我在按钮之间留下了1%的边距

library(shiny)
library(shinydashboard)

foo_body = dashboardBody()
foo_header = dashboardHeader()
foo_sidebar = dashboardSidebar(
  sidebarMenu(
    menuItem(
      "A Dashboard",# add some buttons  
  div(style="display:inline-block;width:32%;text-align: center;",actionButton("button1",icon = icon("paper-plane"))),div(style="display:inline-block;width:32%;text-align: center;",actionButton("button2",actionButton("button3",icon = icon("paper-plane")))

)

foo_page = dashboardPage(
  header = foo_header,output) {}
)

enter image description here

原文链接:https://www.f2er.com/css/427384.html

猜你在找的CSS相关文章