Blurry Drop Down in Modal

Ask us anything
1

I’m having an issue where for some reason my dropdowns in a modal are appearing Blurry. I have no idea why this started happening, it used to work OK.

image
image733×296 11.9 KB

Blurry Once Clicked

image
image745×253 19.7 KB

Any ideas?

2

I have investigated a bit on that, and it seems that it can be related to an IOS bug. Are you on IOS? Which version?

3

I’m actually on Windows. I’ve noticed it appears to be happening when the drop down needs to scroll. I was able to fix it on a couple items by setting the height of the dropdown to be higher, but I didn’t have to do that in the past.

4

Hello. I have the same problem without windows. I wish I had a solution.

Thanks

image
image713×386 22.3 KB

5

Is there a text shadow being applied somewhere? Maybe higher up in the styles?
Maybe try adding:

text-shadow: none !important;
6

Experienced the same problem. Is there any solution?

Css with “text-shadow: none !important;” didn’t help.

Here’s a video: From_scratch | WeWeb - 4 March 2025 | Loom

Vivaldi 7.1.3570.58 (Stable channel) (64 bit)
Version 7d05ce292d7196178c4be6056edee3fccb09ff9c
OS Windows 11 Version 24H2 (Build 26100.3194)
JavaScript V8 13.2.152.41
7

I experienced the same problem with dropdown elements when the element is placed in the new Dialog element. The items in the dropdown appear blurry. Weirdly, they only appear blurry on my external screen (which has a higher resolution than the screen of my Macbook).

1 Like
8

@julian , you saved the day :smile:

wouldn’t even think about the cause of the problem as an external screen. I have two external screens for my windows laptop. But in any case, the problem is clear. Thanks!

After receiving your message, I tried to open the web editor on the laptop screen and didn’t notice any blur

Update: That was a false start - problem still persists even without external screens, but the main condition for it to be noticeable is a scrollbar inside dropdown. Without scrollbar it all looks good.