# Highlight Empty Alt Text Fields in the Media Modal

> Outlines the Alternative Text field in red when it is empty in the media library and media modal, so authors notice it before inserting an image.

- Type: CSS
- Runs: Admin head
- Category: [Accessibility](https://wpide.com/library/category/accessibility/)
- Tags: alt-text, media-library, admin
- Author: WPIDE Team
- Installs: 0
- Updated: 2026-10-28
- Page: https://wpide.com/library/a11y-media-modal-alt-highlight/

## Code

```css
.attachment-details .setting.alt-text textarea:placeholder-shown,
.attachment-details [data-setting="alt"] textarea:placeholder-shown,
#attachment_alt:placeholder-shown {
    border: 2px solid #d63638 !important;
    background: #fcf0f1 !important;
}

.attachment-details [data-setting="alt"] .name::after,
.setting.alt-text .name::after {
    content: " (needed)";
    color: #d63638;
    font-weight: 600;
}
```

## Notes

Pure CSS; it reminds but does not block inserting images.

## How to use it

Install the free WPIDE plugin (https://wordpress.org/plugins/wpide/), find "Highlight Empty Alt Text Fields in the Media Modal" in its snippet library and add it in one click; or create a new CSS snippet in WPIDE (or any code snippets plugin) and paste the code above. More snippets: https://wpide.com/library/
