OH3 Overview Page Spacing and alignment

  • Platform information:
    • Hardware: _amd64
    • OS: Windows 10/10.0
    • Java Runtime Environment: (Zulu11.43+55-CA)
    • openHAB version: openHAB 3.1.0.M5

Hi All

I have a weird alignment/layout issue with cards (cells) displayed via the Overview Page:


As you can see from the above, if the Overview Page is selected via the openHAB logo on the front page. there is a large gap before the actual page is displayed.

If the Overview Page is selected from the Left Panel (the same page), there is no gap.

This affects the way the page is displayed - especially on smaller screens.

The same issue is exhibited for all the Cards/Cells called in this way.

The Page is configured as follows:

component: oh-cell
  title: Power Usage
  trendItem: ShellyEM_MAINS_Watt
    - component: f7-page
          z-index: 0
          --f7-navbar-height: 0px
          --f7-navbar-font-size: 0px
          --f7-navbar-bg-color: white
          --f7-navbar-border-color: white
          --f7-navbar-link-color: black
          --f7-navbar-text-color: black

Full YAML as follows: Power Usage.txt (5.9 KB)

Any suggestions on how to correct this?

EDIT: Replaced GIF


I would file an issue, since it seems to be caused by the unerlying framework and not directly by your page configuration.

1 Like

Thank you.

Submitted as: