Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

The placeholder font-size of Input and Select should be same #3322

Closed
xmeng1 opened this issue Feb 27, 2017 · 4 comments
Closed

The placeholder font-size of Input and Select should be same #3322

xmeng1 opened this issue Feb 27, 2017 · 4 comments

Comments

@xmeng1
Copy link

xmeng1 commented Feb 27, 2017

Bug, feature request, or proposal:

Bug

What is the expected behavior?

The placeholder font-size of Input and Select should be same

What is the current behavior?

According to my usage, I found that the font-size of Input and Select are different:

Input: 20px
Select: 16px

So currently, I just reset it dynamically when the select change.

  setCssDynamical($event) {
    console.log($event);
    $event.source.trigger.nativeElement.childNodes[0].setAttribute("style", "font-size: 20px;font-weight: bold")
  }

      <md-select
        *ngIf="showTokenSelect"
        (change)="setCssDynamical($event)">
        <md-option *ngFor="let domain of domainsDemo" [value]="domain.value"
                   style="font-size: 20px">
          {{domain.viewValue}}
        </md-option>
      </md-select>

I think maybe these font-size should be same.

Which versions of Angular, Material, OS, browsers are affected?

"@angular/material": "^2.0.0-beta.2",

Is there anything else we should know?

According to my understand, I think just change the css of mat-select-trigger

.mat-select-trigger{display:flex;align-items:center;height:30px;min-width:112px;cursor:pointer;position:relative;box-sizing:border-box;font-size:16px}

font-size 16px to 20px

@janisr
Copy link
Contributor

janisr commented Feb 27, 2017

it is not just font size - there is general misalignment between select and input when used side by side

image
placeholders and underline are on different levels

@rajendra2
Copy link

I also has same issue as @janisr . any workaround while proper fix is released ?

I am not able to override .mat-select-trigger attributes from the component.css file.

@kara
Copy link
Contributor

kara commented Mar 1, 2017

This looks like a dupe of #2127. Input inherits its font size while select prescribes 16px. They should handle it the same way.

@kara kara closed this as completed Mar 1, 2017
@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Sep 5, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants