Material textarea label

Topic: Material textarea label

lede pro premium asked 6 years ago

The textarea label seems to be hovering excessively high above the textarea in comparison to text fields. I think this is new in 4.5.7 but not completely sure. I upgraded yesterday and it jumped out at me on my pages today so I don't think it was like this in 4.5.6

Add comment

Jakub Mandra staff premium answered 6 years ago

0 0 Best answer

Hello, This component was not changed in the last update. But, we had some discussions (some users prefer the textarea to be smaller, or even same size as input). We are going to do some research and ask our community what do they think about it, so you could give us your opinion then :) Regards, Jakub from MDB

Add comment

lede pro premium answered 6 years ago

0 0 Best answer

I have fixed this problem. If you look at a text input, the label sits on the line (bottom border). When you click it the label slides up and you type where the cursor is. If you do the same with a md-textarea it doesn't look right. The label is too high. When you click it, the label slides up but where you type is not where the label was positioned. It looks odd. I added the following style to my css which makes a 1 row textarea look the same as a standard text input.

.md-form textarea.md-textarea {
  padding: .3rem 0 .55rem;
}

This has corrected the issue for me, the cursor appears where the label was and the label isn't hovering too far above the input

Marta Szymanska staff pro premium commented 6 years ago

OK, great.

Add comment

Write

Create snippet

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

User: Pro
Premium support: No
Technology: MDB jQuery
MDB Version: -
Device: -
Browser: -
OS: -
Provided sample code: No
Provided link: No

About author

lede

Pro User Premium support

100Support score
14Questions 9Answers

0Snippets likes 0Snippets