- From: Tab Atkins Jr. <jackalmage@gmail.com>
- Date: Wed, 11 Nov 2009 16:45:59 -0600
- To: Brad Kemper <brad.kemper@gmail.com>
- Cc: fantasai <fantasai.lists@inkedblade.net>, www-style <www-style@w3.org>
On Wed, Nov 11, 2009 at 4:40 PM, Brad Kemper <brad.kemper@gmail.com> wrote: > > On Nov 11, 2009, at 2:16 PM, Tab Atkins Jr. wrote: > >>> background-image: linear-gradient(-90deg, transparent, transparent 16px, >>> red >>> 16px, yellow calc(100% - 32px), transparent calc(100% - 32px), >>> transparent) >>> ...instead of >>> background-size: calc(100% - 32px); >>> background-image: linear-gradient(-90deg, red, yellow) >> >> You don't need to add 4 additional stops, just 2. > > How do you figure? I have 2 at the beginning and 2 at the end, otherwise I > get a soft transition between transparent and my intended start color. Your intended start and end colors are red and yellow, right? Then all you need is linear-gradient(transparent 16px, red 16px, yellow calc(100% - 32px), transparent calc(100% - 32px)). That'll force an immediate transition to transparent before and after the intended gradient. ~TJ
Received on Wednesday, 11 November 2009 22:46:54 UTC