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

Re: [CSS3 Text] request: line-padding

From: fantasai <fantasai.lists@inkedblade.net>
Date: Wed, 20 Jan 2010 09:49:21 -0800
Message-ID: <4B574221.30303@inkedblade.net>
To: Brad Kemper <brad.kemper@gmail.com>
CC: "Tab Atkins Jr." <jackalmage@gmail.com>, Kenneth Kufluk <kenneth@kufluk.com>, www-style@w3.org
> On 01/20/2010 05:56 AM, Tab Atkins Jr. wrote:
>> On Wed, Jan 20, 2010 at 5:56 AM, Kenneth Kufluk<kenneth@kufluk.com>  wrote:
>>> Also, in the application I am currently building, we're using
>>> background images as bullets.
>>> I think that using the clone technique will repeat that image:
>>> [img]  One two three--
>>> [img]  four five six--
>>> [img]  seven eight--
>>> [img]  nine ten.--
>> Yes, it will.
>>> While I'm sure I could "fix" this by wrapping another span around the
>>> element, I would rather not do so, if there's another workaround
>>> available.
>> Alternately, switch the box to display:line-item and supply the image
>> as a real bullet via list-style-type.

And by line-item, you mean list-item, I presume. =)
list-items are blocks, and it seems he wants an inline here. Since we
don't have display: inline-list-item yet, the best thing to do for the
bullet would be to use the :before pseudo-element.

On 01/20/2010 08:57 AM, Brad Kemper wrote:
> It sounds to me like you are describing a background pattern.
> Create an image 1px wide, and as tall as two lines of text. Make the
> top half of the image one color and the bottom half a different color,
> and repeat it across the whole multi-line block. Use 'background-size'
> to keep it the height of 2 lines of text (3em in your example), maybe
> starting with a larger-than-needed image so that it scales well.

That's a really hackish way of doing it, and it'll break if there's any
content on any lines that's taller than the default line height.

Received on Wednesday, 20 January 2010 17:49:56 UTC

This archive was generated by hypermail 2.3.1 : Monday, 2 May 2016 14:38:31 UTC