1 Reply Latest reply on Apr 3, 2018 11:03 AM by Eric Pederson

    CSS media selector and calc() function not working.

    Eric Pederson Newbie

      I'm having some troubles using media selectors for my ui widgets.

       

      For example this doesn't seem to work:

      @media all and (max-width: 720px){

         p{

         color:purple;
         background-color: #00b0ff;
         }

      }

       

      Also I tried using setting a width using calc(100vw - 60px) which didn't work either.

       

      Any help will be much appreciated.

        • 1. Re: CSS media selector and calc() function not working.
          Eric Pederson Newbie

          I'm also having a issue with custom css properties.

           

          For example, this isn't working:

          --paper-input-container-color: red;

           

          I believe this is a problem with Errai because it works properly in the browser's developer console,

          but doesn't show up if it is put into a style sheet for a Templated class.

          for example: @Templated(provider = HomeTemplateProvider.class, stylesheet = "home.css")

          Any media selectors, calc functions, or custom properties in home.css won't work.

           

          They will however work if they are put into the index page, but this is not ideal.