·Developer in spare time

WebView component doesn't use full display width on iPhone with an Elfsight script

Widgets & Design

The problem is exactly what I wrote in the title. I have this "Restaurant Menu" script from Elfsight that I would like to show through the FF WebView widget, the problem is that on my OnePlus Nord 3 5G Android cell phone it works perfectly while on the iPhone 15 Pro Max cell phone it only uses 60% of the screen width central.

The test App is available at

https://app.ilpesciaio.it/

and the trouble page is

https://app.ilpesciaio.it/il-pesciaio-modena-menu?menuRef=3b2MDOLTxw76RWreJ7j5

and the test script if anyone wants to try is

<script src="https://static.elfsight.com/platform/platform.js" data-use-service-core defer></script><div class="elfsight-app-41fcaf4c-8111-439c-b027-30ef364b604c" data-elfsight-app-lazy></div>

What have you tried so far?

I also tried using a browser other than Chrome on the two phones but getting the same results on each phone (so the problem doesn't seem to depend on the browser). At the same time I tried to include the Elfsight script in a WordPress or Shopify site and the script works correctly using 100% of the display width even on iPhone, so the problem seems to be WebView or its implementation. I also tried placing the WebView widget in a container, in a column, etc. but it doesn't change the result. Can anyone recommend something else to try?

Did you check FlutterFlow's Documentation for this topic?
Yes
2
2 replies