material-components / material-components/material-web

Textfield: document shows overflowed icons

Open
#5,821 1 comment 2 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
SCSS
Stars
11.3k
Forks
1.1k
Avg merge
20h 28m
Merged PRs (30d)
13

Description

### What is affected?

Component

### Description

![Image](https://github.com/user-attachments/assets/f5ec4a59-8e74-44cf-ad6c-60d334ca1eef)

### Reproduction

https://material-web.dev/components/text-field/#icons

### Workaround

not found

### Is this a regression?

No or unsure. This never worked, or I haven't tried before.

### Affected versions

2.3.0

### Browser/OS/Node environment

Browser: Chrome 137.0.7151.120
OS: Mac OS X 15.5.0

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the Textfield icons example at https://material-web.dev/components/text-field/#icons and compare its behavior with the attached image. Trace the component styles responsible for the overflow; done means the icons no longer overflow in the documented example.

Written by the indexing model from the issue text.

Assessment

Tech stack
scss
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.