W3C home > Mailing lists > Public > www-style@w3.org > June 2010

Re: [css3-background] vastly different takes on "blur"

From: Tab Atkins Jr. <jackalmage@gmail.com>
Date: Tue, 22 Jun 2010 20:08:13 -0700
Message-ID: <AANLkTikwkSNc0j9CfMeaI6v2fWt4jGSoC4O_PkQ4QXvK@mail.gmail.com>
To: robert@ocallahan.org
Cc: Simon Fraser <smfr@me.com>, Brad Kemper <brad.kemper@gmail.com>, fantasai <fantasai.lists@inkedblade.net>, Brian Manthos <brianman@microsoft.com>, "www-style@w3.org" <www-style@w3.org>
On Tue, Jun 22, 2010 at 7:25 PM, Robert O'Callahan <robert@ocallahan.org> wrote:
> On Wed, Jun 23, 2010 at 1:11 PM, Tab Atkins Jr. <jackalmage@gmail.com>
> wrote:
>> Roc, does Firefox have similarly buggy behavior with shadows > 8px?
>> Like I said, I looked in both Firefox and Chrome with a 100px blur
>> shadow, and they both agreed that the shadow extended outwards by
>> approximately 50px.  (By the way, FF's text-shadows are absolutely
>> beautiful at large sizes - good job.)
> Thanks. We don't have any special treatement of radii > 8px.
> Given a glyph 104px wide and a text-shadow blur radius of 100px, the band of
> not-completely-transparent pixels in the shadow is at least 257px wide (the
> shadow is wider but pixels attenuate to alpha=0 due to rounding, as
> previously noted). So the shadow is definitely extending by 100px on each
> side of the glyph. If it were only extending by 50px, the shadow could be no
> wider than 204px. Testcase:
> data:text/html,<meta http-equiv="Content-Type" content="text/html;
> charset=utf-8"><p style="font-size:300px; text-shadow: 400px 0 100px
> black;">❚</p>
> That's not surprising since the same code does the blurring for box-shadow
> and text-shadow and we pass the blur parameter in the same way at both call
> sites.

Interesting.  I'm really not seeing that.  Check out this test case, frex:

<!DOCTYPE html>
<body style="font-size: 1000px; text-shadow: 0 0 100px black; color:
white; font-family: Arial, sans-serif;">
<div style="background: red; width: 100px; height: 3px; position:
absolute; top: 700px; left: 183px;"></div>

(You may have to adjust the "left" on the <div>.)

It seems very clear from a visual inspection that the blur only
extends outward roughly 50px.  This effect occurs on both my Windows
and Linux machines.

Received on Wednesday, 23 June 2010 03:09:06 UTC

This archive was generated by hypermail 2.4.0 : Friday, 25 March 2022 10:07:47 UTC