Background color on hover of some dropdown item is too white - Meta

TopAnswers Meta

Meta

Databases

TeX

Code Golf

APL

C++

.net

db<>fiddle

Java

*nix

PHP

PowerShell

Python

Rust

टेक्-मराठी

Typst

Web Client Dev

Web Server Dev

Background color on hover of some dropdown item is too white

completed bug design add tag

joulev

| Hover on TeX | Hover on Python |
|---|---|
| ![blob](/image?hash=6de7505d0dac0c7e7e74821353835444ef07b7a9a84803d1441036f3ebcb8966) | ![blob](/image?hash=46c43d8a7d77ef27056e7440dab0915529be0ec3d75645158b2cb502e3d31a32) |

The background is too white, so it is quite difficult to see what site the mouse is on in a quick glance.

To other items the color is very fine:

| Hover on Databases |
|---|
| ![blob](/image?hash=c923f40ffd1823ca512f99ada56ec0209b60fe08f21dc1c930564be211a25e63) |

Top Answer

Pax

An alternative to adjusting the background-color (which may be complicated since it depends on a CSS variable that's used in other places?) is increasing the font-weight on hover

![Jun-01-2020 13-34-27.gif](/image?hash=789da6a67845f773301fc76d7dcc58c5014c4fe851ae3eac7d2ed46c5a00387e)

Answer #2

Jack Douglas

Thanks, we've gone for the simple option of adding a border as well on hover.

Answer #3

Pax

Another alternative is a `text-shadow` to make use of the `transition` property that is already there:

![Jun-01-2020 13-46-33_textshadow.gif](/image?hash=19305f8cad78bcefecc25ea7accc39af73034a457315626ece517b3595511a88)


```css
text-shadow:
  -.3px -.3px 0 #999999,
  .3px -.3px 0 #999999,
  -.3px .3px 0 #999999,
  .3px .3px 0 #999999;
```

3 Answers