Stars not filled on iPhone

[zacBkh]

Hello, Thanks a lot for the amazing library.

I have noticed on iPhone only the stars are not filled in yellow in static mode (readOnly) when displaying the rate. Please see the screenshot attached.

It works perfectly on Android phone, the issue appears only on iphone. Any idea what's happening?

Thanks!

[vandercloak]

I am having the same issue with Safari Version 16.5.1 (18615.2.9.11.7). It was working fine on 15.5, but since upgrading it is broken. Works great on chrome.

I believe it has to do with issue/support for display: -webkit-inline-box. I do not yet have a solution, but will post back if I find one.

[vandercloak]

I got it working... But its VERY hacky... but in the hopes it saves someone else some time, here is what worked for me:

<Rating
  emptyStyle={{ display: "flex" }}
  SVGstyle={{ display: "inline-block", marginBottom: 10 }}
  style={{ marginBottom: -10 }}
  ...
/>

The stars were positioned wrong for some reason and the two margin styles resolved it for me so they yellow stars showed up correctly.

[vandercloak]

I got it working... But its VERY hacky... but in the hopes it saves someone else some time, here is what worked for me:

<Rating
  emptyStyle={{ display: "flex" }}
  SVGstyle={{ display: "inline-block", marginBottom: 10 }}
  style={{ marginBottom: -10 }}
  ...
/>

The stars were positioned wrong for some reason and the two margin styles resolved it for me so they yellow stars showed up correctly.

[Phongtesla]

Spending an hour playing with it, i figured out this