一些右对齐的 tabPanels 闪亮

Question

使用navbarPage我想让一些tabPanels右对齐，而其余的tabPanels和navbarMenus左对齐：

所以，而不是这个

library(shiny)    
ui =  tagList(
  navbarPage(
    title = "My app",
    navbarMenu("Left1",
               tabPanel("Subleft11"),
               tabPanel("Subleft12")),
    tabPanel("Left2"),
    tabPanel("Left3"),
    tabPanel("Right1"),
    tabPanel("Right2")
  )
)

server <- function(input, output, session) {}

shinyApp(ui, server)

我想得到这样的东西：

GyD 的解决方案适用tabsetPanel于navbarPage. 我试着添加

tags$head(
    tags$style(HTML(
      ".navbar ul li:nth-child(4) { float: right; }
      .navbar ul li:nth-child(5) { float: right; }"
    ))),

但没有预期的效果。

Answer 1

你可以用一些 css 来做到这一点。这将是一个简单的示例，它将类navbar-nava中的第四个和第五个列表元素对齐float: right;。

通过包含right: 150px;第四个子项，您可以使选项卡保持正确的顺序。

应用程序R

library(shiny)   
library(shinythemes)  

ui =  tagList(
    tags$head(tags$style(HTML("
                           .navbar-nav {
                           float: none !important;
                           }
                           .navbar-nav > li:nth-child(4) {
                           float: right;
                           right: 150px;
                           }
                           .navbar-nav > li:nth-child(5) {
                           float: right;
                           }
                           "))),
  navbarPage(
    title = "My app",
    theme = shinytheme("cerulean"),
    navbarMenu("Left1",
               tabPanel("Subleft11"),
               tabPanel("Subleft12")),
    tabPanel("Left2"),
    tabPanel("Left3"),

    tabPanel("Right1"),
    tabPanel("Right2")

    )
    )

server <- function(input, output, session) {}

shinyApp(ui, server)