Wednesday, September 05, 2007

Problem selecting text in Internet Explorer

"Mirror mirror on the wall, Who's the best browser of the all ?"

If you happen to ask this, you'll not be surprised with the answer that you get - Mozilla. True, with the recent anti-miscrosoft campaign gathering momentum the patrons of IE are being converted to the other faction. And to those who are in favor of IE here's one more reason why you should be thinking again...problems selecting text in IE has been an oft noticed issue. When we click on some text and drag to select them, one can see text getting highlighted incorrectly. The net result - you cannot select the text that you want..

Now that we have the problem defined.. what would be the solution ? AFAIK there is no clean solution to this, the reason being, it is not very clear why this occurs in the first instance. I have been able to spot one clear scenario when this occurs. Whenever the page contains any absolutely positioned element especially container elements like DIV's you can see this occurring. Overlapping div's make things more complicated for IE to render. Again I don't have any solid explanation for this behavior of IE but the only logical conclusion that I could arrive at is that IE is not able to resolve the absolute position of the element on the DOM hierarchy.Hence it tries to select the nearest possible element that it could resolve.. the entire DIV itself !!

Coming to the solution, I have to thank google for leading me to a solution or rather a hack that allows IE to identify these elements correctly. The snippet goes as follows

function HackForIE()
{ = document.documentElement.scrollHeight + 'px';

I would like to thank the author of this piece of finding as this works perfectly. Unfortunately we really don't know why this hack works and enables IE to fix the position of the absolute elements correctly. You ll be surprised folks, to know that, more than half the pages that we browse are ridden with this issue. Hopefully future versions of IE resolve this for good if they want to survive admist the growing popularity of MOZ....


Anonymous said...

your my hero

this hack works, and i'm not trying to understand why ,)

*tnx mate!

Mike's America said...

I'm not sure what I am supposed to do with the hack.

Besides, I have the same problem in Firefox and even sometimes in regular Windows programs.

The problem comes and goes and may be related to some crappy Vista updates.

If anyone has another answer to this, please drop me a note at Mike's America.

Mighty Titan said...

Thanks all! Am glad that the hack worked well for you guys.


You would need to place the function and invoke it within your script tags just like you would do with any other javascript code. I would however suggest that this be placed at the very end of the rendering scheme.