Skip to content

bug: ion-select placeholder has wrong opacity value when labelPlacement="floating" #30402

Closed

Description

@ReneZeidler

Prerequisites

Ionic Framework Version

v8.x

Current Behavior

ion-selects with labelPlacement="floating" show their placeholders with full opacity, instead of the --ion-placeholder-opacity (default 0.6 in md mode)

Image

(all selects are artifically styled as expanded in this example, but this issue is also visible when the placeholder is shown during normal use)

Expected Behavior

The placeholder should have the correct opacity (var(--placeholder-opacity)).

Steps to Reproduce

  1. Open the reproduction URL
  2. Click on any floating select to show its placeholder. Alternatively click the button "style as expanded" to artifically style all selects as expanded at the same time.

Code Reproduction URL

https://stackblitz.com/edit/pxhxnc4c-a6vaud9w

Ionic Info

Ionic:

Ionic CLI : 7.2.1
Ionic Framework : @ionic/angular 8.5.7
@angular-devkit/build-angular : 19.2.11
@angular-devkit/schematics : 19.2.11
@angular/cli : 19.2.11
@ionic/angular-toolkit : 12.2.0

Utility:

cordova-res : not installed globally
native-run : not installed globally

System:

NodeJS : v20.19.1 (/usr/local/bin/node)
npm : 10.8.2
OS : Linux 5.0

Additional Information

The CSS rule to unhide the placeholder for floating labels sets the opacity to the fixed value 1, instead of var(--placeholder-opacity).

Image

There is also a related issue visible in this example, where the placeholder overlaps the label when the input is focused, see #30401.

Activity

  1. changed the title [-]bug: ion-select placeholder has wrong opacity when labelPlacement="floating"[/-] [+]bug: ion-select placeholder has wrong opacity value when labelPlacement="floating"[/+] on May 9, 2025
  2. kripa-sindhu-007 commented on May 11, 2025

    @kripa-sindhu-007

    Can I work on this issue ??

  3. Luis-Coforge commented on Aug 29, 2025

    @Luis-Coforge

    Hello, is this issue still open? Could I please take it?

  4. added a commit that references this issue on Aug 14, 2026
    fad7c0a
  5. ionitron-bot commented on Sep 18, 2026

    @ionitron-bot

    Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.

  6. locked and limited conversation to collaborators on Sep 18, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    type: buga confirmed bug report

    Type

    Fields

    Stage

    None yet

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions