-
-
Notifications
You must be signed in to change notification settings - Fork 1.2k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
bug: Dropdown for select
on Safari uses serif font
#2311
Comments
@trepidacious I tried to look at this issue and it seems like the semibold font weight variant is causing this problem on Safari. From what I've found out, in case the font in There might not be a way to set different font weights to the options dropdown and the selected option itself to keep it looking the way it is supposed to here. I also haven't found a way to make Safari use the specified fallback fonts. As we can't directly target Safari from CSS, the only fix would probably be not to use the semibold font weight variant at all. However, because it seems to be Safari's internal fault, it would make more sense to ignore this for now than to change the look for all browsers because of this issue as it would create other inconsistencies. |
@y4qub Thanks for looking into this - I can confirm I get the same results here, the only difference is cyberpunk also shows the issue for me, I think I might have semi-bold available for the font used. I've also confirmed that the workarounds work on my page. For me, using bold weight isn't too bad. I can just build this into my theme. I've submitted feedback to Apple just in case it might get fixed, I added a minimal reproduction (just needs I think your conclusion on not changing the appearance to work around a Safari bug makes sense. My only addition would be that there could be an argument for using bold rather than semi-bold regardless of the bug, since it's more likely to be present in fonts, so won't end up at different weights depending on which font is used? On the other hand, semi-bold does look good. |
What version of daisyUI are you using?
v3.6.4
Describe your issue
When
select
elements are styled with daisyUI (adding at least theselect
class), the dropdown they display will use a serif font on Safari. This doesn't match the usual macOS dropdown appearance or the rest of the website.I'm seeing this on Safari Version 16.5.2 (18615.2.9.11.10), on macOS 13.4.1 (c) (22F770820d).
The examples on daisyui.com show this issue:
Unstyled
select
elements don't show this, e.g. on the MDN select page:What browsers are you seeing the problem on?
Safari
Reproduction URL
https://daisyui.com/components/select/
The text was updated successfully, but these errors were encountered: