Summary

Updated the Select component to explicitly use box-sizing: border-box, which prevents select elements from overflowing their containers in host environments where global box sizing may be reset.

Breaking change

This is not a breaking change.

Related issue

Closes #6605

Related pull requests

None.

Preview link

Preview link: Not available.

Problem statement

The Select component can overflow its container in host environments that reset box sizing to content-box. Since .usa-select uses width: 100% with right padding for the dropdown icon, the padding can be added outside the element width and cause layout overlap.

Solution

Added box-sizing: border-box; directly to the .usa-select rule so the component keeps its padding inside the declared width. This preserves the existing padding-right behavior while making the component more resilient in third-party host environments.

Major changes

• Added box-sizing: border-box; to packages/usa-select/src/styles/_usa-select.scss.

Testing and review

• Verified the change is limited to packages/usa-select/src/styles/_usa-select.scss.
• Not run locally; change is a one-line Sass fix.