locked
ui-dark.css and ui-light.css stomping over existing styles

    Question

  • Has anyone come across an issue where if you didn't use the standard microsoft styles for building an app, and then use microsoft styles (ui-dark) for a settings charm flyout, the styles from that sheet stomp over existing default view styles?  I don't quite understand how styles from one page, can/should override styles on a completely different page.
    Friday, July 06, 2012 4:32 PM

Answers

All replies

  • In you HTML header, does the ui-dark.css link come after your CSS file link? Because it sounds like you just have a simple cascade or specificity problem:

    Cascading order and specificity

    Understanding CSS Selectors

     

    Friday, July 06, 2012 5:06 PM
  • The styles MS defined in its default CSS are too verbose and miss the entire point of "Cascading". You basically just specify a colour for input elements once and not for every type of input. The CSS seems like generated and I would like to optimize all the redundancy out of it. Anybody know a good tool for that? Its very hard to customize the MS styles the way they are defined right now.
    Wednesday, October 10, 2012 4:02 PM
  • The other issue is that at least in the Navigation template style app, once a CSS file is loaded it stays loaded at the application level.  So you have to be very explicit in your page CSS files or you end up with unintended consequences.
    Wednesday, October 10, 2012 5:27 PM
  • The other issue is that at least in the Navigation template style app, once a CSS file is loaded it stays loaded at the application level.  So you have to be very explicit in your page CSS files or you end up with unintended consequences.

    That's why by default all page CSS is scoped to the page's class.
    Thursday, October 11, 2012 5:18 PM