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

Re: [css3-text-layout] New editor's draft - margin-before/after/start/end etc.

From: MURAKAMI Shinyu <murakami@antenna.co.jp>
Date: Wed, 26 May 2010 23:32:17 +0900
To: www-style@w3.org
Message-Id: <20100526233217.2F54.C598BCD7@antenna.co.jp>
Håkon Wium Lie <howcome@opera.com> wrote on 2010/05/26 1:56:29
> These properties were recently added to the editor's draft of CSS Text
> Layout Module [1]:
> 
>    margin-before, margin-after, margin-start, margin-end 
>    padding-before, padding-after, padding-start, padding-end 
>    border-before-width, border-after-width, border-start-width, border-end-width 
>    border-before-style, border-after-style, border-start-style, border-end-style 
>    border-before-color, border-after-color, border-start-color, border-end-color 
>    border-before, border-after, border-start, border-end 
>    logical-width, logical-height 
>    min-logical-width, min-logical-height 
>    max-logical-width, max-logical-height 
> 
> I understand that writing-direction-based naming has been requested
> [2]. However, I do not believe that adding 30 new properties to CSS is
> the right solution to the problem at hand. These 30 new properties,
> which cascade/inherit separately on each element will incur
> significatn costs to implementations, especially on constrained
> devices.

For UAs supporting only horizontal writing, *-before, *-after,
logical-width and logical-height are simply aliases of *-top, *-bottom,
width and height respectively. No costs needed.

Mozilla and WebKit already implemented *-start and *-end properties:
http://help.dottoro.com/lcqbjiaw.php
https://developer.mozilla.org/En/CSS:-moz-margin-start
http://developer.apple.com/safari/library/documentation/AppleApplications/Reference/SafariCSSRef/Articles/StandardCSSProperties.html#//apple_ref/doc/uid/TP30001266--webkit-margin-start

> 
> I would like to explore how the issues at hand can be addressed
> through other solutions. For example, by using the :lang selector:
> 
>   p { 
>     margin: 10px 20px;
>   }
> 
>   p:lang(ja) {
>     writing-mode: tb-rl;
>     margin: 20px 10px;
>   }
> 

This style sheet only works on UAs supporting writing-mode: tb-rl;
i.e., works well with IE but miserable with Opera.
An example:
http://www.asahi-net.or.jp/~eb2m-mrt/epub/tategakiTest.html
looks good if the browser supports vertical writing, but it looks miserable, otherwise.

Style sheet authors who would like to use vertical writing mode
expect not only the best result on UAs supporting vertical text
but also proper result on other UAs.


> [1] http://dev.w3.org/csswg/css3-text-layout/
> [2] http://lists.w3.org/Archives/Public/www-style/2010Apr/0278.html


Best regards,

-- 
村上 真雄 (MURAKAMI Shinyu)
http://twitter.com/MurakamiShinyu
Antenna House Formatter:
http://www.antenna.co.jp/AHF/
http://www.antennahouse.com
Received on Wednesday, 26 May 2010 14:33:00 GMT

This archive was generated by hypermail 2.3.1 : Tuesday, 26 March 2013 17:20:27 GMT