View Full Version : TextArea component adds 4px to height

21 Aug 2015, 11:50 AM
Every instance of where I am using a TextArea component, I find that I have an extra 4px in height. This is a problem because I have a custom plugin to render an error message bubble directly below the TextArea field. With the extra 4px, I see a gap between my textarea field and the error bubble.

When I step through the code, I don't see the extra pixels in afterrender, but something happens between the afterrender event and the boxready event because once I break in the boxready event I find that 4px have been added.

I can of course add code to my plugin that will take account of the 4 extra pixels for all TextArea components. But that is not a real solution to the underlying problem.

Does anyone know why/where the extra 4 pixels is added?

Note: The 4px height is added to the first <div> element within the <td>, which causes the top level <table> element to increase in height.

<div> <-----------this div for some reason gets an extra 4px

Example: I set my textarea's height config property to 80. I launch my app and look at the debugger. Under the "Styles" tab of Chrome debugger I can see that height is being set to 80. I look under the "Computed" tab and it says 84px.

EDIT: This happens only in Chrome.

29 Aug 2015, 9:33 AM

Can you share a test case that demonstrates this issue? https://fiddle.sencha.com

I'll be happy to test it along with you.