Magic Border Of The Unexpected Variety

[Blinky the Shark]

I've got a weird one for you.

On my main page: http://blinkynet.net/

With Firefox, if I left click anywhere on the page, the thin black border
of the first photo (Cousin Stinky) disappears, and the image shifts just
that tiny amount up and left to compensate. The caption also moves just a
hair with it.

With Konqueror, the same thing happens plus the adjacent lines in
the paragraph in which the image appears shifts a hair to the left as well.

None of that in Opera.

Whuh?

 

[Martin Jay]

I've got a weird one for you.

On my main page: http://blinkynet.net/

With Firefox, if I left click anywhere on the page, the thin black border
of the first photo (Cousin Stinky) disappears, and the image shifts just
that tiny amount up and left to compensate. The caption also moves just a
hair with it.

It's this line at the bottom of your CSS that's causing the effect:

:active IMG { border: none }

To me, it appear to be a correct action.

 

[Jonathan N. Little]

I've got a weird one for you.

On my main page: http://blinkynet.net/

With Firefox, if I left click anywhere on the page, the thin black border
of the first photo (Cousin Stinky) disappears, and the image shifts just
that tiny amount up and left to compensate. The caption also moves just a
hair with it.

With Konqueror, the same thing happens plus the adjacent lines in
the paragraph in which the image appears shifts a hair to the left as well.

None of that in Opera.

I think in your CSS:

:link IMG {

border : none;

}
:visited IMG {

border : none;

}
:active IMG {

border : none;

}

where you have pseudo-classes not attach to any element or class so that
Firefox et al. will view it as a wildcard and apply to such non-link
elements as DIV, P, LI and all...and the BODY perhaps? And ':active' on
a link traps when your have 'mousedown' event, so I assume that Firefox
is interpreting your CSS as

BODY:active IMG { border : none; }

so a 'mousedown' anywhere on the BODY will remove a border on any IMG
that is child of the BODY thus changing its spacing if the image had a
border causing the jittery reflow...

 

[Blinky the Shark]

I think in your CSS:

:link IMG {

border : none;

}
:visited IMG {

border : none;

}
:active IMG {

border : none;

}

where you have pseudo-classes not attach to any element or class so that
Firefox et al. will view it as a wildcard and apply to such non-link
elements as DIV, P, LI and all...and the BODY perhaps? And ':active' on a
link traps when your have 'mousedown' event, so I assume that Firefox
is interpreting your CSS as

BODY:active IMG { border : none; }

so a 'mousedown' anywhere on the BODY will remove a border on any IMG that
is child of the BODY thus changing its spacing if the image had a border
causing the jittery reflow...

Thanks, and thanks to all. Methinks I should've figured that out. :-/