Csswg-drafts: [css-position] physical inset properties

Created on 25 Apr 2020  Â·  6Comments  Â·  Source: w3c/csswg-drafts

The CSS Logical Properties and Values specification defines an inset shorthand property that sets physical values. This seems helpful because it follows consistent expectations with other directional shorthands.

It may also be helpful to CSS authors if the other physical inset properties were represented with inset-* prefixes for parity — inset-top, inset-right, inset-bottom, and inset-left.

inset-top:    auto | <length-percentage>

inset-right:  auto | <length-percentage>

inset-bottom: auto | <length-percentage>

inset-left:   auto | <length-percentage>

A drawback to this proposal may be the lack of new functionality this syntactical sugar provides. CSS already has top, right, bottom, and left properties, and they are shorter in length.

This request is focused on providing familiarity to CSS authors by having both logical and physical inset-* properties. This request is intended to be thematically similar to the shorthand gap property and support for trailing commas.

Closed Rejected as Wontfix by CSSWG Resolution Commenter Response Pending css-logical-1 css-position-3

Most helpful comment

While I agree it would have been nice to have all of them under a prefix originally, I doubt that adding an alias at this point is worthwhile. We only add property aliases in situations where the original property name is bad and we'd like to replace it; t/r/b/l are overall fine. They're also very common, meaning that adding the alias has a decent chance of causing confusion rather than reducing confusion.

All 6 comments

While I agree it would have been nice to have all of them under a prefix originally, I doubt that adding an alias at this point is worthwhile. We only add property aliases in situations where the original property name is bad and we'd like to replace it; t/r/b/l are overall fine. They're also very common, meaning that adding the alias has a decent chance of causing confusion rather than reducing confusion.

I understand not wanting to add new aliases for perfectly good properties – but I think this case is complicated by the fact that there _are_ inset-* properties, and inset is _not a shorthand for those properties_. I'm not sure if aliases are the only option to address that, but I agree with @jonathantneal that the current names are misleading. Not only do inset and t/r/b/l lack a clear relationship, but inset implies a clear relationship _to the wrong longhands_. That's very likely to cause confusion.

I tend to agree with Tab that, while it may be slightly surprising that the constituent physical longhands are not named inset-{top,bottom,right,left}, that it's not strange enough to justify adding the aliases.

For what it's worth, the inset shorthand can set the inset-* logical properties, by using the logical keyword in the shorthand value (or whatever syntax #1282 ends up with).

One could argue that since there are now logical (medial) shorthands inset-block and inset-inline, we should also have physical shorthands inset-vertical or inset-y (for top and bottom) and inset-horizontal or inset-x (for right and left), but this would also apply to other TRBL properties.

By the way, the values are specified as <'top'>, which resolves to auto | <length-percentage>. While technically correct, it is a bit confusing to read. Can we get an explicit <inset>, please?

The CSS Working Group just discussed [css-position] physical inset properties, and agreed to the following:

  • RESOLVED: Close issue, add a note tot he spec trying to explain the confusion

The full IRC log of that discussion
<dael> Topic: [css-position] physical inset properties

<AmeliaBR> s/ except regular input/, same as regular input/

<dael> github: https://github.com/w3c/csswg-drafts/issues/5005

<dael> TabAtkins: In position spec physical is tlbr. Logical inset properties names -start etc. incl inset shorthand

<dael> TabAtkins: Jonathan Neill suggested corrisponding names for phsyical so they're under same inset prefix. Rejected b/c only do aliases when original name is bad. Not the case here.

<dael> TabAtkins: Slightly bad that t/l/b/r are not unified, but they're perfectly good names.

<dael> TabAtkins: I wanted to confirm with WG that rejection is okay

<oriol> +1

<dael> astearns: Seeing +1 from heycam|away and mostly +1 from miriam in issue

<dael> astearns: Prop is close no change

<dael> miriam: I think there is a clear potential for confusion here, but I don't know this is right solution. I don't have something else in mind. Confusion I see is less that they're not all unified and more that inset is a shorthand for something different than it looks like a shorthand for

<dael> TabAtkins: I forgot, inset shorthand does set phsyically unless ue logical keyword. True...I don't think we want precident of when both phsyical and logical if there's a shorthand we defualt logical. Worth calling out in the spec. Still think current definition is right for overall consistancy

<dael> fantasai: Needs to be consistent with margin

<dael> TabAtkins: Happy to add a call out for potential of confusion that it by default sets phsyicals though can set logicals

<dael> miriam: Works for me

<dael> astearns: Prop: Add text to the spec trying to explain away the confusion

<dael> TabAtkins: It'll be a notes

<dael> astearns: Nice to figure out some solution to this.

<dael> astearns: Objections to Close issue?

<dael> RESOLVED: Close issue, add a note tot he spec trying to explain the confusion

Note added in dac155905

Was this page helpful?
0 / 5 - 0 ratings