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.

Sign up for GitHub

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

Jump to bottom

(Select) select options does not fully responsive #7811

Closed
tieppt opened this issue Oct 15, 2017 · 12 comments · Fixed by #14932
Closed

(Select) select options does not fully responsive #7811

tieppt opened this issue Oct 15, 2017 · 12 comments · Fixed by #14932
Labels
P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent

Comments

@tieppt
Copy link

tieppt commented Oct 15, 2017

Bug, feature request, or proposal:

[ x ] Bug

What is the current behavior?

At the first show the select options, the cdk calculate width for select options, after that when user resize (rotate screen on mobile) the cdk does not recalculate again. So the width of select options is overflowing the container.

What is the expected behavior?

The width of select options is adaptive.

What are the steps to reproduce?

Resize this page:

https://angular-dynamic-forms.firebaseapp.com/

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

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

Is there anything else we should know?
@ortaras
Copy link

ortaras commented Oct 19, 2017

001
002
003
004

@josephperrott josephperrott added P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent responsive labels Oct 31, 2017
@yoonjesung yoonjesung mentioned this issue Dec 9, 2017
Open
@julianobrasil julianobrasil mentioned this issue Dec 12, 2017
Closed
@sagar-ganatra
Copy link

Any update on this? I've noticed the same behaviour and it's stopping me from using this library.

@leNicDev
Copy link

leNicDev commented Jan 9, 2018

Experiencing the same issue here!

@coffeetea-synchestra
Copy link

The same :(

@djob
Copy link

djob commented Feb 19, 2018

Any update?

@SteveGZr
Copy link

Got the same issue!

@iamxor
Copy link

iamxor commented Feb 26, 2018

hey any chance to fix dis?

@dik-garri
Copy link

Any update to solve this?

@siqiren819
Copy link

Any update please?

@dik-garri
Copy link

dik-garri commented Jul 13, 2018 •
edited
Loading

@siqiren819
After updating @angular/material to the last version for me it works better. Not perfect for small screens, but generally much better

@BezobidnijPsih
Copy link

would be great to have it fixed

crisbeto added a commit to crisbeto/material2 that referenced this issue Dec 22, 2018
@crisbeto
fix(overlay): update size if dimensions change in overlay directives
4d92909 
Fixes the size of the overlay not being updated by the connected overlay directive, if it changes while open. This is required in order to handle cases like angular#7811.
@crisbeto crisbeto mentioned this issue Dec 22, 2018
Merged
vivian-hu-zz pushed a commit that referenced this issue Jan 16, 2019
@crisbeto @vivian-hu-zz
fix(overlay): update size if dimensions change in overlay directives (#…
c92d8c9 
…14610)

Fixes the size of the overlay not being updated by the connected overlay directive, if it changes while open. This is required in order to handle cases like #7811.
s2-abdo pushed a commit to s2-abdo/material2 that referenced this issue Jan 18, 2019
@crisbeto @s2-abdo
fix(overlay): update size if dimensions change in overlay directives (a…
6d6811f 
…ngular#14610)

Fixes the size of the overlay not being updated by the connected overlay directive, if it changes while open. This is required in order to handle cases like angular#7811.
s2-abdo pushed a commit to s2-abdo/material2 that referenced this issue Jan 18, 2019
@crisbeto @s2-abdo
fix(overlay): update size if dimensions change in overlay directives (a…
9bc145a 
…ngular#14610)

Fixes the size of the overlay not being updated by the connected overlay directive, if it changes while open. This is required in order to handle cases like angular#7811.
vivian-hu-zz pushed a commit that referenced this issue Jan 18, 2019
@crisbeto
fix(overlay): update size if dimensions change in overlay directives (#…
0eefaa7 
…14610)

Fixes the size of the overlay not being updated by the connected overlay directive, if it changes while open. This is required in order to handle cases like #7811.
crisbeto added a commit to crisbeto/material2 that referenced this issue Jan 23, 2019
@crisbeto
fix(select): update panel width if the viewport size changes
030505f 
Updates the width of the select panel if the width of the viewport has changed. This handles cases like the user switch their device's orientation.

Fixes angular#7811.
@crisbeto crisbeto mentioned this issue Jan 23, 2019
Merged
jelbourn pushed a commit that referenced this issue Feb 22, 2019
@crisbeto @jelbourn
fix(select): update panel width if the viewport size changes (#14932)
78f55ea 
Updates the width of the select panel if the width of the viewport has changed. This handles cases like the user switch their device's orientation.

Fixes #7811.
@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 10, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees
No one assigned
Labels
P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

fix(select): update panel width if the viewport size changes crisbeto/material2