Calcite popovers / expand widget not rendering in correct position

kaleb_integralNZ

I have a problem where my popovers, calcite dropdowns and such all don't quite line up.

It could be to do with how my web app is laid out. I'm unsure which part would trigger this.

This problem only occurs on Chromium based browsers. Firefox is fine.

ChromeFirefox

 

Reproducible Example:

https://codepen.io/kaleb_integralnz/pen/wvVJwgx

MattDriscoll

Hello @kaleb_integralNZ ,

 

Here is a fix: https://codepen.io/driskull/pen/eYqveRg

arcgis-map {
  height: 100%;
  container-type: inline-size;
  contain: layout;
}

 

Here is some more information on why this is needed:

https://dev.to/michaelcharles/chrome-129s-container-query-change-2i77

https://issues.chromium.org/issues/369781727?pli=1

 

Let me know if that solves it for you.