One of the features of both flex boxes and grids is that their children can accept a special style: order:#. This enables the grid or flex box object to display their contents in an order unrelated to their actual html coded position.

As a consequence, although panels in the APW are ordered; Temperature, Rainfall, Winds, Pressure and Solar, you can alter this simply by adding a style order:x; and replacing the 'x' with a number to indicate the rank order of each panel.

• Direct children of the grid or flex box with no number are considered to have the number '0' and will be displayed in coding order.
• Children with an order number will be displayed in numerical ascending order
• Children with the same order number will continue to be displayed together in coding order.

There are always exceptions. This particularly applies to grids as they also support areas of the grid being named. If order numbers are used in a named grid then all content allocated to the named area and its numerical equivalent will appear in that one area. Note that named areas can occupy more than one grid area and that content will overlay in the order in which it is coded.

The following pages all use either grids or flexbox layouts and so can be 'manipulated' using the order:x style:

• All the Charts pages:This is usually limited to the placement of any buttons and information text. You may prefer the buttons to be above or below the charts.
• All the Records pages.You may also wish to experiment making them single or two column layouts.
• The NOAA ReportsYou can place the selectors below the report if you wish.
• The GaugesYou can place the gauges in any order you wish. This is a flexbox layout so, although you can place the information panel at the top, it may reduce in size to a standard sized panel. It has been given an order number of 22 by default.
• The Today Vs Yesterday page.Place the the panels in any order that you wish. You may also like to experiment making it a two column layout.
• The Yesterday, Today and Dashboard pages.