Issue 136822 in chromium: Jumping when using "position: fixed", "-webkit-backface-visibility: hidden", and textarea

55 views
Skip to first unread message

chro...@googlecode.com

unread,
Jul 11, 2012, 12:04:27 PM7/11/12
to chromi...@chromium.org
Status: Unconfirmed
Owner: ----
Labels: OS-Mac Area-Undefined Pri-2 Type-Bug

New issue 136822 by m...@janpaulposma.nl: Jumping when using "position:
fixed", "-webkit-backface-visibility: hidden", and textarea
http://code.google.com/p/chromium/issues/detail?id=136822

Chrome Version : 22.0.1201.0
OS Version: OS X 10.7.4
URLs (if applicable) : http://jsfiddle.net/VvZNX/3/
Other browsers tested:
Add OK or FAIL after other browsers where you have tested this issue:
Safari 5.1.6: OK
Firefox 13.0.1: OK

What steps will reproduce the problem?
1. Create a page with a fixed positioned div ("the top div")
2. Create an absolutely positioned div inside the top div, and give it the
-webkit-backface-visibility: hidden; css property.
3. Create an absolutely positioned textarea inside the top div
(see the jsfiddle link at the top for step 1-3)
4. Add enough text into the textarea such that a scrollbar appears
5. Place the cursor at the end of the text
6. Hold backspace

What is the expected result?
The absolutely positioned div should stay in place.

What happens instead?
The absolutely positioned div jumps. In fact, it takes same offset compared
to the top div, that the top div has compared to the page body.

Browser information:
UserAgentString: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_7_4)
AppleWebKit/537.1 (KHTML, like Gecko) Chrome/22.0.1201.0 Safari/537.1


chro...@googlecode.com

unread,
Oct 31, 2012, 5:07:05 AM10/31/12
to chromi...@chromium.org

Comment #2 on issue 136822 by JVeh...@gmail.com: Jumping when
using "position: fixed", "-webkit-backface-visibility: hidden", and textarea
http://code.google.com/p/chromium/issues/detail?id=136822

This can be reproduced even easier: http://jsfiddle.net/VvZNX/13/

Setting -webkit-transform: translate(0) or -webkit-backface-visibility:
visible on an element that is somewhere in the dom before (can be deep down
the dom-tree) a position: fixed element triggers this behavior

A workaround is setting -webkit-transform: translate(0) on all fixed
elements with textboxes in them.


chro...@googlecode.com

unread,
Dec 14, 2012, 11:52:10 PM12/14/12
to chromi...@chromium.org

Comment #3 on issue 136822 by dig...@gmail.com: Jumping when
using "position: fixed", "-webkit-backface-visibility: hidden", and textarea
http://code.google.com/p/chromium/issues/detail?id=136822

any update? we have the same issue...

chro...@googlecode.com

unread,
Jan 16, 2013, 8:00:04 AM1/16/13
to chromi...@chromium.org

Comment #4 on issue 136822 by rohan.da...@gmail.com: Jumping when
using "position: fixed", "-webkit-backface-visibility: hidden", and textarea
http://code.google.com/p/chromium/issues/detail?id=136822

Can confirm that this is still happening in 24.0.1312.52 m. Thanks
JVeh...@gmail.com - setting -webkit-transform: translate(0) on the
container div worked.

In my case, I had a textarea in a position:absolute div in a
position:absolute 'lightbox' type div (covering entire screen). On removing
text such that the textarea did not require the scrollbar, the entire
lightbox div moved to the top corner of the position of the textarea.
However, on resizing (or sometimes just by moving the cursor) the
positioning corrected itself.

chro...@googlecode.com

unread,
Feb 14, 2013, 9:26:11 AM2/14/13
to chromi...@chromium.org

Comment #5 on issue 136822 by alexcome...@gmail.com: Jumping when
using "position: fixed", "-webkit-backface-visibility: hidden", and textarea
http://code.google.com/p/chromium/issues/detail?id=136822

very annoying bug...:(

--
You received this message because this project is configured to send all
issue notifications to this address.
You may adjust your notification preferences at:
https://code.google.com/hosting/settings
Reply all
Reply to author
Forward
0 new messages