Media Queries in H-SMILE core.

Implementation of Media Queries resembles CSS3 Media Queries but uses CSSS! expression syntax.

Therefore this CSS3 MQ

@media handheld and (min-width: 20em),
       screen and (min-width: 20em) { ... }

in H-SMILE core will look like as:

@media handheld && (min-width >= 20em),
       screen && (min-width >= 20em) { ... }

Media queries get executed in runtime when engine receives from the OS notification about environment changes. So if for example orientation of the device changes you can adjust some styles like:

@media handheld && orientation-portrait 
{
  body { flow:vertical; }
}
@media handheld && orientation-landscape 
{
  body { flow:horizontal; }
}

By default H-SMILE core sets following variables. These variables can be reset by application for the whole view or particular <frame>.

Media Queries also supported by <style media="">, <link media=""> elements and @import statements.