Why does adding a CSS file to Shiny navbarPage create a blank tab?

user_9835261 0
Viewed 535

I am ultimately trying to add a background image and logo to my shiny app that utilizes the navbarPage layout. Adding a simple CSS file with the background image I want creates this blank li object in the navbar.

Even when the CSS file is completely blank, I get the same problem. Somehow, the mere inclusion of a CSS file creates the issue. Any clues?

I had working version before I needed to include the logo in the top left corner....

enter image description here

enter image description here

Working version with background image but no logo:

enter image description here enter image description here

navbar shiny css
4 Answers

I had the same issue, there is an argument for the header in navbarPage called header. This will work when tags$header will put the css file in the navbar

             ui <- navbarPage('title,
                      header = inlcudeCSS('www/css/file/css),
                      theme = shinytheme('flatly'),
                    .........
             ) # end UI
user_113610230

Have you tried to include your css file in a different way?

I would suggest to use tag$head:

tags$head(
      tags$link(rel = "stylesheet", type = "text/css", href = "www/theme2.css")
)

also, you can add your logo using:

title=div(img(src="logo.jpg"))

and then add some styling to the div. I think it's much easier solution than playing with img tag.

user_22360830

I would try

ui <- tagList(
  includeCSS("www/theme2.css"),
  navbarPage(
    ......
  )
)
user_11001070

i also had a same issue. I found a post in github that there are some shiny users had a problem with this blank or ghost tab when they are using CSS. In my case, I got the blank tab when using navbarPage() and used useShinydashboard(), not when adding the CSS. I think this issue is not specifically caused by adding CSS. I suggest you to use tagList as mentioned by Stéphane Laurent. Assuming you also add some shinydashboard function in your application like I did, here is my solution looks like.

ui <- tagList(
  useShinydashboard(),
  navbarPage(title = "Title",
             theme = shinytheme("united"),
             Home_ui,
             Map_ui
  )
)

It would be great to share your findings if you have solved your issue.

user_138998300
Related