W3C home > Mailing lists > Public > whatwg@whatwg.org > April 2010

[whatwg] img as a layout tool to describe the displayed region of a CSS background-image

From: Ingo Chao <i4chao@googlemail.com>
Date: Wed, 28 Apr 2010 22:59:23 +0200
Message-ID: <u2p879e9bc51004281359kc24b77c4u1a4155530d00e151@mail.gmail.com>
2010/4/28 Tab Atkins Jr. <jackalmage at gmail.com>:
> On Wed, Apr 28, 2010 at 1:04 PM, Steve Dennis <admin at subcide.com> wrote:
>> On 28/04/2010, at 7:43 PM, Tab Atkins Jr. wrote:
>>
>>> On Wed, Apr 28, 2010 at 4:31 AM, Ingo Chao <i4chao at googlemail.com> wrote:
>>>> http://dev.w3.org/html5/spec/Overview.html#the-img-element
>>>> "The img must not be used as a layout tool.
>>
>> I think this may be a little vague/broad. ?I understand the intention, but say for example I have a logo image in the top left of my header, and my header doesn't have a static height set (in case something in the header needs it to grow or shrink for instance), then the height of the logo image is dictating the height of its parent, and this would seem to me, to be using an img as a layout tool, in a sense.
>
> Don't overthink it. ?It's a very simple rule. ?^_^ ?Having an img
> *interact* in the layout is both fine and obviously necessary. ?The
> restriction is to prevent someone from using an <img> element *solely*
> for layout purposes.
>
> ~TJ
>

I agree that using an img that spans up an area to show a fragment of
a background-image is a hack, non-conforming with HTML5.

Thanks for the answers.

We are combining a hundred icons into one sprite for performance
reasons, and it is not that easy to mask out portions of a
background-image with pure CSS in every case. Tricky, or hackish.
Maybe CSS3 will allow fragment indentifiers to slice a background
image; a less hackish solution for the usage of sprites.
http://www.w3.org/TR/css3-images/#url

Thanks,
  Ingo

-- 
Ingo Chao
http://www.satzansatz.de/
Received on Wednesday, 28 April 2010 13:59:23 UTC

This archive was generated by hypermail 2.4.0 : Wednesday, 22 January 2020 16:59:22 UTC