Re: [css3-writing-modes] a third option for implementing logical properties

On Oct 25, 2010, at 1:10 AM, John Daggett wrote:

> David Hyatt wrote:
> 
>> Yes, we know we need mixed writing modes within the same document. 
>> The question is do the vertical text sections have to degrade
>> gracefully to horizontal using the same stylesheet, or could the
>> author just feed a separate stylesheet to browsers that don't support
>> vertical text?
> 
> So how would you feel about this:
> 
> 1. Use a subset of Murakami-san's proposed additional 'logical' keyword [1]
>    proposal for margin-*, padding-*, border-*, top, bottom, left, right
>    (physical would be implied by a lack of 'logical'):
> 
>    p { 
>      margin: 1em 0px;
>      margin: logical 1em 0px;
>    }
> 

I like the idea of the logical keyword for the shorthands.  If we defined new shorthands for setting width and height together (something I think people might like anyway), we could make those new shorthands support the logical keyword too, and then all of the current logical properties would be covered.

Instead of

.box { width: 50px; height:100px }

If we had

.box { size: 50px 100px }

Then the size property could support the logical keyword.

.box { size: 50px 100px logical }

So then you could have margin, padding, border, border-width, border-style, border-color, border-radius, size, min-size, and max-size all support the "logical" keyword, and you wouldn't have to define all of the individual properties.

I also think this reads better than individual properties, since it forces you to think about all four box sides at once, and the vendor prefix is less intrusive. :)

So yes, I'm tentatively in favor of this idea, although I think it's critical to have support for border-radius, width/height, min-width/min-height and max-width/max-height.

There's still positioning to deal with (absolute/relative/fixed positioning with left/top/right/bottom).  The best idea I can come up with is to have a position-offsets shorthand that specifies left/right/top/bottom together, and then apply the logical keyword to it like with the other shorthands.

Introducing shorthands just to be able to apply the logical keyword to them may not be the best approach though.

> 2. A new @writing-mode rule that would enclose style rules only used with
>    user agents that fully support all writing-mode modes defined in
>    CSS3 Writing Modes.
> 
>    /* styles used for fallback horizontal layout */
>    .rounded { border-radius: 1em 2em; }
> 
>    @writing-mode {
>      /* styles used when writing modes are supported */
>      .rounded { border-radius: 2em 1em; }
>    }
> 

Any reason this couldn't just be a media query?  I think the ability to select on the presence of writing-mode support in general is valuable, so I'm in favor of this idea also.  It seems like it could just be a media query rather than a specialized @-rule though.

dave

Received on Monday, 25 October 2010 07:42:46 UTC