Skip to content

Autocomplete Panel width #3198

Closed
Closed

Description

Bug, feature request, or proposal:

A Way to set the panel width in autocomplete

What is the expected behavior?

The panel width could have a property to change the panel-width.

What is the current behavior?

The panel width isn't wide enough, so the content doesn't fit in it. My project is hosted in heroku, so it compiles the project remotely and donwload the material autocomplete code also remotely (so I can't customize de component scss)

What are the steps to reproduce?

Just modify the example of the material.angular.io, changing the width of to 100% and modify one of the states name to a longer name.

Plunker Link: https://plnkr.co/edit/nKgx04MYK0q0xhS1yfAZ?p=preview

In plunker, just click on the input to see that the panel is too short to show the first name, even if there's a lot of space in the window.

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

@angular/cli: 1.0.0-beta.32.3 [1.0.0-beta.30]
node: 6.9.5
os: win32 x64
@angular/cli: 1.0.0-beta.32.3
@angular/common: 2.4.8
@angular/compiler: 2.4.8
@angular/core: 2.4.8
@angular/flex-layout: 2.0.0-beta.5
@angular/forms: 2.4.8
@angular/http: 2.4.8
@angular/material: 2.0.0-beta.2
@angular/platform-browser: 2.4.8
@angular/platform-browser-dynamic: 2.4.8
@angular/router: 3.4.8
@angular/compiler-cli: 2.4.8

Is there anything else we should know?

I'm currently setting the encapsulation to None in the host component to fix it, but I don't know if this is the recommended way to make the things right.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Assignees

No one assigned

    Labels

    P3An issue that is relevant to core functions, but does not impede progress. Important, but not urgenthelp wantedThe team would appreciate a PR from the community to address this issue

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions