CODEWITHSUNDEEP
cssrshiny
John
John

Reputation: 1828

R shiny: How to change the width of a progress-bar

How to edit the CSS to change the width of the progress-bar?

enter image description here

I put in

  div.progress-bar{
    width:100px
  }

  progress-bar{
    width:100px
  }

but it doesn't work.

Upvotes: 1

Views: 1223

Answers (1)

Pork Chop
Pork Chop

Reputation: 29407

Your bar has an Id = file1_progress so you can style that. Have a look at my example below, I set mine to 100px

rm(list = ls())
library(shiny)

ui <- fluidPage(
  titlePanel("My R Shiny App"),
  sidebarPanel(
    fileInput('file',  'Choose file to upload.' ),width=3),
    tags$style(type="text/css", "#file_progress { max-width: 100px; }")
)

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

enter image description here

Upvotes: 2

Related Questions