textarea.js is incompatible with IE

Patch for 4.7 attached.

I should add that I marked this bug 'critical' because the rendering problems can be quite ugly, even with our default themes, and thus make Drupal look bad on the most popular web browser.

Marked http://drupal.org/node/101207 a duplicate of this bug.

And this bug is not critical. Critical bug status is reserved for bugs that severely break functionality in Drupal. "Looking ugly" doesn't qualify. :)

You're right, it isn't critical.

I did provide a patch (for 4.7 and 5.0) so I set the status to code needs review.

I don't have IE6 so I can't test this. Someone else will have to make a final decision on this patch.

Here's a screeny in IE 6. Looks good but it should be checked in 5.5 also.

How about getting rid of the long class. A comment explaining why the span's there should be good enough.

http://browsershots.org/png/full/85/8560098fcd629927fd215bd53e748bfb.png

How does one apply this patch in 4.7?

Am using Drupal 5rc1 and the Garland theme. There is indeed a rendering bug in IE6. It causes the textarea to shift to the left in relation to the grippie, in my case causing the 1st few columns of the textarea to be clipped. The v5 patch above does prevent this rendering bug.

I don't see this using HEAD and IE6. It may have already been fixed by jQuery 1.0.4 or other fixes since rc1.

It is not a bug in jQuery and so would not be affected by the upgrade to 1.0.4.

textarea.js in CVS HEAD still reparents textareas below a div with class resizable-textarea with a CSS width field. Therefore, the problem still exists.

I can resize a textarea in IE6 and RC2 without problems.

drumm closed this issue, saying "I can resize a textarea in IE6 and RC2 without problems." That's great, but the bug is not about being unable to resize a textarea. Please re-read the description.

I count two commentors on this issue, plus myself, who have verified the bug and confirmed that this fix works. I have re-rolled the patch for DRUPAL-5 HEAD. It is ready to be commited for 5.x-dev and 6.x-dev.

Should I be able to apply this to 5.0 final?
[Can't seem to get it to apply]

Well, Though I can't apply the patch, the concept seems fine.

I was having issues with textareas meesed up on;
-Zen theme [Textaears floated Way off to the right]
-Garland [Floated Hidden to the left]

On IE 6 and IE7

By Editing line 7 in textarea.js

The patch I most recently uploaded was accidentally for 4.7, not 5. I am now attaching a patch rolled against Drupal 5.0/HEAD (for now, they are the same).

I'm setting the Version to 6.x since all patches are supposed to start against HEAD. Once it is applied to HEAD, it should be applied to 5.0 and 4.7 (using the patch file earlier in this issue).

Apparently I mis-understood the process for patch status updates and should not have marked this "ready to be committed."

The patch is done, several people have verified the bug and the fix, and it is ready for 4.7, 5.0, and 6-dev. I think an obvious and unattractive rendering flaw with our default theme on IE 6 and 7 is a pretty big problem (even though it is IE's fault, not Drupal's) and the fix ought to be committed.

The patch appears to be missing?

There doesn't appear to be another fix for this, so we'll just have to apply it.

My bad. Patch for 5.0/HEAD re-attached. The originally attached patch for 4.7 (update #1) is still valid. Actually, the original patch for 5.0/HEAD (initial post) is, too; the only change between the original and this one is that I removed class="resizable-textarea-ie-hack" from the new <span> tag. I don't think it matters if it is present or not.

My symptom: see this issue. When working with Drupal 5.0, using the Zen Theme, when viewing in Internet Explorer 6, the main (middle) column on page /node/add/story slips underneath the left sidebar.

When I scroll down to look at the textareas, they seem misaligned. (see attached screenshot).

I applied the latest patch, and this solved that problem.

Environment: Windows XP, Internet Explorer 6, Server: Apache 2 on Linux, PHP 5.1.6.

We're having this problem with the Zen theme. My understanding is that all this adds is a 'span' element inside the wrapper div. There's really no easy way to fix this at the theme or module level.

+1 on this, most definitely!

Thanks a bunch for the patch! Me be lucky now since this time, I didn't spend 6 hours on figuring out what was causing this ugly bug in IE6/IE7!

Worked for my, using zen and IE7
+1
Thanks!

If you are going to put a link in the code comments, it should be to this issue on d.o not a 3rd-party site. IIRC linking to issues in code comments is discouraged as well.

Not linking to a third-party site is sensible, though in fact the Drupal 5 source contains links to php.net, w3.org, zend.com, bugs.php.net, and xmlrpc.com in comments. However, linking to a d.o issue that explains an otherwise obscure piece of code (there is no standards-compliant benefit to wrapping an empty around something) seems like a really good idea.

Nevertheless, I'm attaching new patch files with no link at all. Here is the 5/HEAD patch.

Here is the 4.7 patch.

I am using this patch as well. It's working for me for zen-fixed, IE6, Drupal 5.1. Nice work!

+1 Great patch. Fixed the problem in IE7, IE6, and IE5.5 for Drupal 5.1 using the Zen theme.

Six people have confirmed that this patch solves the problem but have not marked it RTBC, so I am.

Thank you for this fix bjaspan. This has solved a very elusive issue to fix.

This bug has caused the entire #main content area to be pushed below #sidebar-left using the Zen theme and the IE/6 browser on Windows.

Thanks again -- this would have been very difficult to track down........

bjaspan's patch in #24 worked well for me in my 5.1, heavily modified Zen theme.

Thanks for the patch!

#24 works. thanks bjaspan !

The patch from bjaspan seems to do the tricks for me, also... :D

I'd love to commit this, but I'm not sure this is the right solution. I'd like to invite Steven, nedjo or another jQuery expert to cast their vote.

Dries, this is not a jQuery issue, it is an IE bug workaround. I've provided patches for 4.7 and 5 version of textarea.js because that is where the IE bug is triggered, not because the bug or patch has anything to do with JavaScript.

Please read http://positioniseverything.net/explorer/inherited_margin.html for details about the IE bug and fix.

This patch works great for me on several Drupal 5.1 sites.

This patch works great for me on several Drupal 5.1 sites.

I've committed this to CVS HEAD. Lowering the version number so Neil can evaluate this for Drupal 5.

Wrong patch committed. The right patch is #24 without the URL.

And a belated "thank you" to Barry. I've actually been using this fix for a while now, but couldn't remember where I'd got it from. Cheers :)

-K

The 5.0 patch worked well. Thanks for the efforts.

You're welcome!

It isn't clear from the comments which versions (besides HEAD) it has been committed to.

You can see it here: http://cvs.drupal.org/viewcvs/drupal/drupal/misc/textarea.js?r1=1.13&r2=...

-K

Committed to 5.

I think I noticed a 4.7 patch.

Wrong patch committed (again).

zen: is there a difference in the actual code? Can you post a diff between what is in CVS now and what it should be?

@drumm: No. Just the comment.

I'm reassigning this to 6-dev with the fix.

Thanks,
-K

This doesn't look like the right patch either -- patch doesn't apply.

Dries: I just tested it on HEAD and the patch applies fine. It's just a one-liner ...

The fix works well for Drupal 5.x too. Verified.

Holy crap. I manually patched this in 5.1 and it worked! Thanks.

This is expected to go into 6.x-dev before a port patch will be committed to 5.x-dev.(AFAIK)

All that is left for this is a one-line comment change as posted in #46; no testing or porting is needed. However, I'm marking this as fixed since apparently no one minds the inclusion of the URL in the comment.

Great! This is now fixed in 6.x and 5.x. Only 4.7.x remains. The patch in comment #25 is still correct for 4.7 and ready to be applied.

Ok, which one should I pply to 4.7?

Apply #25 to 4.7.

applied

Hello,

Even with the above patch and workarounds, I'm still getting the problem where the right menu gets pushed down. Attached are two screenshots - IE (problem) and Firefox (how I want it to work). Any ideas?

Thanks,
Andrey.

@mr.andrey: your problem is nothing to do with that patch. Can you reproduce this using Garland? If not, it might be a theme issue.

Found a solution.. kind of:

in layout.css:

I'm ok with the fixed width, so this will work. Any other ideas are much appreciated!

Thanks,
Andrey.

This one still seems to be lurking for me on XP-SP2 with IE6 (not by choice). Of course it's fine and lovely dandy on windows with Safari, Opera Firefox.. @recidive I'm using an unmodified Zen theme.

So I've checked that the /misc/textarea.js has the patch/workaround kindly highlighted here and the workaround is in there, but I'm still getting this IE display bug.

I was hoping the workaround was proven as per a number of cases above so it's a drag it's back for me.

It would be great to be able to use the Zen as a theme foundation but this bug is making it hard.

Anyone with ideas? TIA

uerks, looks even worse with the unmodified zen fixed theme

Moving to the correct project.

This newly reported issue with the Zen theme has nothing to do with the originally reported and fixed problem with IE6 and textareas. In fact, there are no textareas or other form input elements in the new screenshots.

It is important and useful to keep old fixed bug reports intact for future reference, so we should not re-use this issue for all IE6 theme bugs. Therefore, I am putting this back to the Drupal project and marking it fixed again.

You can and should of course submit a new issue for the Zen project for this bug. Thanks!