Re: [Fwd: Re: non-rectangular images & <img> tag]

Since a long time[3], there is a proposal for an extension to the 
'float' property to allow text that wraps around the real shape of an 
image. The CSS side is very simple, just one extra keyword, 'contour':

    IMG { float: left contour }

but on the implementation side, the work is more difficult. It requires 
finding the fully transparent parts of the image (on one side only[2]) 
and adjusting the length of each line box next to the image. If we want 
to take the image's 'margin-right' property into account, it's a little 
bit more complicated still.

The effect would be similar to Eric Meyer's "ragged float"[1], but 
easier.

So far, the demand hasn't been strong enough to outweigh the 
implementation cost.


[1] http://meyerweb.com/eric/css/edge/raggedfloat/demo.html

[2] For a left floating image, all (fully) transparent pixels that are 
connected by a horizontal line to the right edge of the image are 
subtracted from the image, for example:

    ...........................   # = non-transparent
    ++++++++++++#..............   + = transparent
    ++++++++++#####............   . = removed from image
    ++++++++#########..........
    ++++++#############........
    ++++++##+++##++++##........
    ++++++##+++##++++##........
    ++++++#######++++##........
    ++++++#######++++##........
    ...........................

[3] http://www.w3.org/TR/WD-css1-960726.html#float



Bert
-- 
  Bert Bos                                ( W 3 C ) http://www.w3.org/
  http://www.w3.org/people/bos                               W3C/ERCIM
  bert@w3.org                             2004 Rt des Lucioles / BP 93
  +33 (0)4 92 38 76 92            06902 Sophia Antipolis Cedex, France

Received on Wednesday, 25 April 2007 13:05:02 UTC