css files for different multiple screen sizes?

Thread is closed for posting
2 posts, 0 answers
  1. Tim
    Tim avatar
    20 posts
    Member since:
    Apr 2016

    Posted 10 Jul 2016 Link to this post

    I have been reading the nativescript documentation on supporting multiple screen sizes.

    I have been able to define all my views without specifying the width & height values. However there are a few elements that are used on several screens that I have set the height for in the app.css.

    So is it possible to specify app.minWH600.css ?


    The documentation alludes to it, but provides the view XML files as example, and then uses the css as an example of a platform specifier. 



  2. Nick Iliev
    Nick Iliev avatar
    351 posts

    Posted 11 Jul 2016 Link to this post

    Hello Tim,

    Currently, it is not possible to specify differently CSS files for multiple screen sizes.
    However, CSS itself is providing an easier way to create different UX for your screen size qualifiers files.
    Consider the following scenario:

    You have
    And you need to provide different styles for both pages.
    What you can do is the following:
    .my-button-for-wh720page {
       background-color: red
    .my-button-for-wh480page {
       background-color: blue

    And use them accordingly where needed
    For example: 
    the button in main-page.minWH720,xml will have cssClass="my-button-for-wh720page"
    the button in main-page.minWH480,xml will have cssClass="my-button-for-wh480page"

    Nikolay Iliev
    Telerik by Progress
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Back to Top