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

[TextField] Fix the recent regressions #13017

Merged
merged 2 commits into from
Sep 29, 2018
Merged

[TextField] Fix the recent regressions #13017

merged 2 commits into from
Sep 29, 2018

Conversation

slipo
Copy link
Contributor

@slipo slipo commented Sep 27, 2018 •
edited by oliviertassinari
Loading

Multiline, fullwidth textfields have padding which is added on top of the width: 100% which means they can break out of the parent element.

Here's the example code:

<div style={{width: 100, backgroundColor: 'gray'}}>
  <TextField
    fullWidth
    label='non-ml'
    variant='filled'
    required
  />
  <TextField
    fullWidth
    label='multiline'
    variant='filled'
    required
    multiline
  />
</div>

Screenshot before this patch:
s1

Screenshot after this patch:
s2

Closes #12994.

@slipo slipo changed the title Make it so multiline, fullwidth textfield is not more than 100% width. [FilledInput] Make it so multiline, fullwidth textfield is not more than 100% width. Sep 27, 2018
@oliviertassinari
Copy link
Member

This issue is related to #12994.

@oliviertassinari oliviertassinari self-assigned this Sep 27, 2018
@oliviertassinari oliviertassinari added bug 🐛 Something doesn't work component: text field This is the name of the generic UI component, not the React module! labels Sep 29, 2018
@oliviertassinari oliviertassinari changed the title [FilledInput] Make it so multiline, fullwidth textfield is not more than 100% width. [TextField] Fix the recent regressions Sep 29, 2018
@oliviertassinari
Copy link
Member

@slipo I have extended the pull request to fix more regressions/bugs we have recently released.

@oliviertassinari oliviertassinari merged commit 9d270f6 into mui:master Sep 29, 2018
@oliviertassinari
Copy link
Member

oliviertassinari commented Sep 29, 2018 •
edited
Loading

@slipo It's a great first pull request on Material-UI 👌🏻. Thank you for working on it!

@slipo slipo deleted the textarea-fullwidth branch September 30, 2018 13:36
marcelpanse pushed a commit to marcelpanse/material-ui that referenced this pull request Oct 2, 2018
@slipo @marcelpanse
[TextField] Fix the recent regressions (mui#13017)
3c36aea 
* Make it so multiline, fullwidth textfield is not more than 100% width.

* handle more issues
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers
No reviews
Assignees

@oliviertassinari oliviertassinari

Labels
bug 🐛 Something doesn't work component: text field This is the name of the generic UI component, not the React module!
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
2 participants
@slipo @oliviertassinari