Misalignment of Icons in specific configuration

[BKeyport]

The forecast icons are misaligned when you're not using headers in table mode so it looks a little clunky.

config is as follows:

            module: "MMM-OpenWeatherForecast",  // https://github.com/jclarke0000/MMM-OpenWeatherForecast
            position: "top_left", 
            header: "",
            config: {
                apikey: "KEY",      //must quote
                latitude: 47.1699527,                                                               //Quote or don't. 
                longitude: -122.3901978,                                                    //Quote or don't. 
                units: "imperial",  
                forecastLayout: "table", 
                animateMainIconOnly: "false",
                dailyForecastTableHeaderText: "",
                hourlyForecastTableHeaderText: "Upcoming:",
                forecastHeaderText: "",
                showDailyTableHeaderRow: false,
                concise: false,
            }
        },

[jclarke0000]

This is a necessary evil. By enabling the ability to show more optional data besides wind and rain, it's possible that hourly and daily forecasts will display different data columns, and therefore weekly and hourly forecasts use separate tables. I can't enforce a fixed column width because I don't know the what columns you've configured, nor do I know the width of the Magic Mirror region you are using for this module. Furthermore, if you've set consise: false in your config, that will change the width of the display for some columns.

To work around this, you can write CSS in your custom.css file to explicitly set the column widths for the columns you are using. Examine the file mmm-openweather-forecast.njk to see what class names are used. Everything has a unique class name so you should be able to target exactly what you need to change to customise the display to your needs.