Posted by Jonathan N. Little on 12/29/06 11:57

Toby Inkster wrote:
> Jonathan N. Little wrote:
>> Toby Inkster wrote:
>>
>>> This works nicely in Opera 9 and IE 6, but not quite as well in
>>> Gecko-based browsers.
>>>
>>> http://examples.tobyinkster.co.uk/mystrike
>> Why? Looks the same to me in Seamonkey and Firefox, maybe a slight
>> heavier, but maybe tweaking your padding may improve it.
>
> Checked in Moz 1.7.11 and found that the line from the strike-through is a
> couple of pixels lower than the line added by the background image, which
> results in two lines through the text -- a fat anti-aliased one, and a
> thin sharp one.
>

There is a difference of option of what constitutes the *bounding box*
of a character among browsers. I became most aware of this in my own
site where I have boxed dropcaps. Moz 1.7.x was the most generous
including all possible ascender and descender space + padding and IE was
the least just to the baseline. SeaMonkey and new Firefox (newer Geckos)
are somewhere in between. Possibly playing with the number and pixels in
the image and being a little asymmetrical in the vertical placement can
get a better looking results.

> In IE 6 and Opera 9, the thin line is superimposed above the fat line,
> giving the impression of just one line.
>
> This may be font-dependant though.

I bet it is!

--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com

[Back to original message]