f



Paradoxical interference of italic text here with link-text there

I'm returning to the strange behavior of IE 7 that I first brought up in
"Q.: Sharper pair of eyes needed ... " of 4/1/2016 10:20:40 PM EDT.

I have a curious example -- far from minimal, alas, but exemplary -- of an
italicized word in one DIV interfering with the clickability of what want
to be link-texts in table-cells unrelated to that DIV.

There's no paradoxical interference in any non-IE browsers I've tried, and
as for IE I only have IE 7 at hand to experiment with, so make no claims as
regards the behavior of newer or older versions of IE.

Here, though, are two HTML files: 

<http://Mahabharata.tlvp.net/Opow-221.htm>, and
<http://Mahabharata.tlvp.net/Opow-221-flaky.htm>.

They differ primarily  in that the flaky one uses a simple italicized
<i>&#347;raddha</i> in an early DIV (for laying out in 18pt characters the
full subtitle of this Installment), while the acceptable one appends a NBSP
to that italic word, so: <i>&#347;raddha</i>&nbsp; .

Why bother?

The flaky one, opened in IE7 (my rough and ready tool for checking how a
page responds to differing viewport widths -- cell phones, tablets, small
laptops, large monitors, etc.) at various window-widths suffers as follows
(note *other* (non-IE) browsers do *not* manifest this (mis-)behavior): 

if you find the italicized 18pt "śraddha" and try to click any of the link
texts in the cells to its right and *lower down* on the page, you find them
inert, while those in cells *higher up* are active. That goes both for
their "tool-tips" and for their calling up a fresh HTML page. IE7 allows
very narrow browser windows, and, for the very narrowest, link text in the
top three cells is active (while that in the lower five is not); but by the
time the window is wide enough for "śraddha" to be as high as the words
"Czytelnia Book Nook", only the uppermost "TLVP Home" text stays "hot".

Yet the HTML is valid (note I make *no* such claim for the CSS :-{ ),

The non-flaky one differs from the flaky one *only* in using 

<i>&#347;raddha</i>&nbsp;

where the flaky one has 

<i>&#347;raddha</i> .

(Well, and in lacking an extra comment line enclosed within <!-- and --> .)

The HTML (and CSS) there is (are) as valid (or not) as in the flaky one,
but now all eight instances of link-text in the vertical table at the right
*are* hot -- show tool-tips when hovered over, deliver the promised linked
HTML pages when clicked upon, in IE 7 just as in all non-IE browsers I've
tried.

I was very happy to have stumbled upon this simple &nbsp; "insulation"
work-around to the problem of getting the links in the table to function
correctly. 

(I could also have de-italicised "śraddha", but found that unacceptable.)

My question, still, now as earlier, remains: what is it that causes such
"uninsulated" italics in one DIV to interfere so with anchors in an
unrelated area, in IE7, of course? ... and not in other browsers?

And why should appending &nbsp; function so effectively as "insulation"?

As it's (still) Memorial Day in my time zone, consider the above to be my
little contribution to the Memorial Day BBQ trough :-) . And thank you for
your ruminations as you chew on it.

Cheers, -- tlvp
-- 
Avant de repondre, jeter la poubelle, SVP.
0
tlvp
5/31/2016 4:26:18 AM
comp.authoring.html 7078 articles. 0 followers. Post Follow

0 Replies
462 Views

Similar Articles

[PageSpeed] 31

Reply: