Skip to content

md-input with md-prefix and width:100% has weird rendering #1881

Closed
@adarshaj

Description

@adarshaj

Bug, feature request, or proposal:

Bug

What is the expected behavior?

The prefix on md-input should consume the space enough for the content within prefix.
I made a simple codepen of how it works in angularjs: https://codepen.io/anon/pen/VmKaNv (contrast with material2 impelmentation in plunkr below)

What is the current behavior?

there is a weird amount of space between the prefix and the placeholder text

What are the steps to reproduce?

Code to reproduce buggy behavior:

<md-input floatingPlaceholder="false" placeholder="Search" style="width:100%;">
   <span md-prefix><md-icon>search</md-icon>&nbsp;</span>
</md-input>

This Plunker has a simple search box with 100% width, see the preview in a large screen to be sure of behavior.
Plunker template: http://plnkr.co/edit/nCYNQGtfoZPQ04FUFy2L

What is the use-case or motivation for changing an existing behavior?

It looks ugly, also, it doesn't conform with other material design implementation (viz. in material design of angularjs)

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

All.

Is there anything else we should know?

Nope.

Metadata

Metadata

Labels

No labels
No labels

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions