How to add additional spacing in r shiny titlePanel while using div and span?

Question

This seems to be a very straight forward question, but I can't seem to create an additional space before my text in the title Panel. What bothers me is that the text is too close to the left edge. I do not want to center the text, I just want it to be moved inward slightly.

I tried using the tab command from R

\t

And manually adding the non breaking space

 

Here is the code for my titlePanel:

ui <- fluidPage(

shinyjs::useShinyjs(),
titlePanel(div(span("Title", style = "color:red"),
               style={'background-color:black;'},
               br(),
               span(em(h3("Subtitle")), style = "color:red"),
               
               img(height = 100, width = 200, src = "...")),
           
),  
           
mainPanel()
           
)

Answer 1

We could use padding-left in the style argument of the div :

shinyApp(ui = fluidPage(
  
  shinyjs::useShinyjs(),
  titlePanel(div(span("Title", style = "color:red"),
                 style={'background-color:black; padding-left: 15px'},
                 br(),
                 span(em(h3("Subtitle")), style = "color:red"),
                 
                 img(height = 100, width = 200, src = "...")),
             
  ),  
  
  mainPanel()
  
), server = function(input, output) {
  
})