[R闪亮 - 在可折叠菜单项右对齐操作按钮造成重影效果?

问题描述 投票:0回答:1

我有在侧边栏菜单中包含三个可折叠的菜单项shinydashboard。第一个菜单项包含了我想要右对齐的操作按钮。当菜单项被扩大,按钮是可见的,但溢出到第二菜单项的标签:

enter image description here

是什么造成这样的效果,我该如何去修复它?

这里是重现应用程序的代码:

library("shiny")
library("shinydashboard")

header = dashboardHeader()

sidebar = dashboardSidebar(
  sidebarMenu(

    menuItem("Item 1", tabName = "item1", 

             selectInput("letters", "Letters:", choices = LETTERS),

             tags$div(class = "pull-right", 
                      actionButton("clickme", label = "Click me", style = "primary")
             )

    ), 

    menuItem("Item 2"), 
    menuItem("Item 3")

  )
)
body = dashboardBody()

ui = dashboardPage(header, sidebar, body)

server = function(input,output,session){}

shinyApp(ui, server)

class = "pull-right"更换style = "float:right;"有同样的效果。

添加这种风格:

.skin-blue .sidebar-menu>li>.treeview-menu {
    overflow: auto;
}

似乎摆脱了拖影问题,但增加了一个滚动的selectInput下拉列表中,这是我不希望的溢出部分:

enter image description here

html css r shiny shinydashboard
1个回答
0
投票

要对齐action button到我们所能做的CSS类似here

sidebar = dashboardSidebar(
  sidebarMenu(
    menuItem("Item 1", tabName = "item1",
             selectInput("letters", "Letters:", choices = LETTERS),
             actionButton("clickme", label = "Click me", style = "primary"),
             tags$style(type='text/css', "button#clickme {margin-left: 60%;}")), 
    menuItem("Item 2"), 
    menuItem("Item 3")
  )
)

另外

menuItem("Item 1", tabName = "item1",
             selectInput("letters", "Letters:", choices = LETTERS),
             div(style="display:inline-block;margin-left: 52%;padding-bottom: 10px;",
                 actionButton("clickme", label = "Click me", style = "primary")) 
© www.soinside.com 2019 - 2024. All rights reserved.