Material-ui: [SelectField] Invalid height when has floatingLabelText and empty value
umidbekkarimov
👍1
All 5 comments
+1.
Looks like this is caused by the wrapper div having a height of 72px, and the inner div having a height of 100% and a margin-top of 14px.
Switching margin-top to padding-top should resolve, since padding-top is included within the height whereas margin-top is outside (with box-sizing:border-box).
Unfortunately I'm new to react/material-ui and don't know where I'd look to fix this. I'll keep digging.
sidot3291
on 19 May 2016
👍2
I believe it's this:
https://github.com/callemall/material-ui/blob/c824ad8896e1a85afc4789ae570775133276da4f/src/TextField/TextField.js#L87
sidot3291
on 19 May 2016
👍1
Do you guys have any temporary fix for this?
tomascharad
on 22 Jul 2016
👍2
Adding labelStyle={{height: '56px'}} fixed it for me, but super annoying
ben-av
on 21 Nov 2016
👍4
My issue ended up being invalid alignment for inline forms, this issue.
JarLowrey
on 20 Feb 2018
Was this page helpful?
0 / 5 - 0 ratings
Related issues
iamzhouyi
路
3Comments
ghost
路
3Comments
anthony-dandrea
路
3Comments
activatedgeek
路
3Comments
ericraffin
路
3Comments
Most helpful comment
Adding labelStyle={{height: '56px'}} fixed it for me, but super annoying