Hidden text can be selected in IE despite style='display:none'

Question

This appears to be an IE-specific \'feature\'. I tested using IE8. User John H has contributing by confirming in IE6 and IE7.

I have some text that gets built into

Answer 1

The size display and position of the element doesn't matter, it's being selected because when you select things in IE<9, you are selecting html and then pasting that html, with hidden elements. IE9 and other browsers properly remove those hidden elements from the selection. The only way i know of to prevent it is to not have the hidden element in the dom.

Answer 2

I think it's better if you use:

position: absolute; left: -10000px;

That will eliminate any potential IE problems.

Answer 3

Have you tried the visibility:collapse property?

If the "Value I want hidden" part is used purely for computational purposes, you should use the "data" attribute.

Like this

<div data-custom-value="1001">Visible value </div>

In jQuery, HTML data attributes are automatically available via the data() api.

You can do

someElement.data('customValue') to read a value.

and

someElement.data('customValue', newValue) to set a value.

Hope I analyzed your problem correctly.