locked
Change orientation and color of progress bar RRS feed

  • Question

  • how to make progress bar vertically and change its color as well?
    Monday, February 20, 2012 10:34 AM

Answers

  • Hi RainyCherry,

    To make progress bar vertically, you can apply -ms-transform: rotate property.

    Please refer to Quickstart: Using CSS3 2D Transforms.

    To change progress bar color, please refer to Quickstart: Styling controls for more details.


    Best wishes,


    Robin [MSFT]
    MSDN Community Support | Feedback to us
    Get or Request Code Sample from Microsoft
    Please remember to mark the replies as answers if they help and unmark them if they provide no help.

    Monday, February 20, 2012 1:36 PM
    Moderator
  • And the DOM explorer is your friend. It's the DOM that's outputted, so the progress bar will come out as dics and stuff, and you can see the CSS that builds it all. Then just write your own CSS to override the built in CSS.

    Note: Never, ever, touch the ui-dark.css or ui-light.css. Styles cascade, so write your own CSS to override them.

    Monday, February 20, 2012 4:31 PM

All replies

  • Hi RainyCherry,

    To make progress bar vertically, you can apply -ms-transform: rotate property.

    Please refer to Quickstart: Using CSS3 2D Transforms.

    To change progress bar color, please refer to Quickstart: Styling controls for more details.


    Best wishes,


    Robin [MSFT]
    MSDN Community Support | Feedback to us
    Get or Request Code Sample from Microsoft
    Please remember to mark the replies as answers if they help and unmark them if they provide no help.

    Monday, February 20, 2012 1:36 PM
    Moderator
  • And the DOM explorer is your friend. It's the DOM that's outputted, so the progress bar will come out as dics and stuff, and you can see the CSS that builds it all. Then just write your own CSS to override the built in CSS.

    Note: Never, ever, touch the ui-dark.css or ui-light.css. Styles cascade, so write your own CSS to override them.

    Monday, February 20, 2012 4:31 PM