-
Notifications
You must be signed in to change notification settings - Fork 672
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[css-logical-1] Interaction of shorthands and logical properties #3030
Comments
Proposal: During parsing of a css declaration block, shorthands (like During serialization, each During serialization, a specific rule should be added in case all longhand properties of one ex:
should serialize as When removing a shorthand property, all the longhand associated with that shorthand should be removed, regardless of their |
( |
proposed text for the statement above would be something like:
|
I'm reasonably happy with @FremyCompany's proposal above. One thought about another option is that we could say that appending a shorthand property could set all of its constituent shorthands of one mapping logic and also remove all of the constituent shorthands of the other. We could even go further and do that same removal during serialization. I'd also note that we need to consider shorthands (e.g., |
The CSS Working Group just discussed
The full IRC log of that discussion<fantasai> Topic: CSS Logical Properties<fantasai> github: https://github.com//issues/3030 <Rossen_> github: https://github.com//issues/3030 <tantek> fremy: main issue is that in CSS spec it defines how to serialize properties, contains a lot of tricks to merge declarations <tantek> ... e.g. if you set all four border properties, the rules merge it to a single declaration <tantek> ... when I looked at the logical properties, this is not as easy <tantek> ... even if you have all four, you cannot always merge them into a single property <tantek> ... it means you have to detect this case (e.g. inline-start) and do something smart <tantek> ... logical and physical properties <tantek> ... proposing a couple of rules to the serialization steps <tantek> ... to only merge all four if they are of the same type <tantek> ... while we were looking at this, a few more updates <tantek> ... e.g. dbaron proposed if you set the margin property on the style attribute <tantek> ... there is no reason to keep the margin-inline properties <tantek> ... the logical ones <fantasai> (because they have all now been overridden) <tantek> ... proposal: make sure that the grouping would work <tantek> ... making sure when you set things you override propertly <emilio> q+ <tantek> s/propertly/properly <tantek> emilio: Gecko has the concept of logical property groups <tantek> ... we added it to the spec <tantek> ... this concept already exists <tantek> ... e.g. border-inline-start:10px; border-start:20px; <tantek> ... Gecko will do the right thing <tantek> ... the concept is already in the spec. this is an obvious bugfix <tantek> fremy: the link you sent sounds like exactly what I'm proposing that seems fine <Rossen_> See the refs for https://drafts.csswg.org/css-logical-1/#logical-property-group <tantek> s/the link you sent/emilio's link https://drafts.csswg.org/css-logical-1/#logical-property-group <tantek> fantasai: we should make sure ... interleaved ... then that can be folded into a shorthand <emilio> https://drafts.csswg.org/cssom/#set-a-css-declaration is already using this concept <emilio> We should use it from serialization <tantek> ... the other part of your proposal, if a shorthand is set, then you can drop any previous declarations that set any property in that logical property group <tantek> fremy: that sounds correct to me <tantek> Rossen_: do we not have this currently specified? the part you just added fantasai ? in terms of the behavior? <tantek> fantasai: I think in terms of how everything is supposed to behave like cascade, etc. is defined. this is about CSSOM interaction <tantek> Rossen_: so this is going into CSSOM then? mostly? <tantek> fantasai: I guess so. emilio and I will work it out <tantek> Rossen_: any other opinions? <tantek> emilio: I need to look a bit more closely at the replace all the physical longhands <tantek> ... because there are more complex cases <tantek> ... e.g. shorthands that only override two properties <tantek> ... like the serialization stuff when stuff is interleaved, that's good <tantek> ... the replace of the existing physical properties, that may or may not be confusing <tantek> fantasai: I think they are two separate proposals that happen to be in the same issue <tantek> Rossen_: can you separate them for resolutions? <fantasai> First proposal from fremy: During parsing of a css declaration block, shorthands (like margin and all) expands only to the set of longhand (grouped by mapping logic: so either logical or physical) required to describe their value, and by default resort to use physical properties if both sets are possible. Note that they can only expand if they do not contain var() substitutions. <fantasai> Second proposal from fremy: During serialization, each logical property group is considered, and shorthand values can be emitted instead of the longhands only if the all the longhands of the same mapping logic are present and consecutive (ignoring all properties that are not in the group). Otherwise, the shorthand is not used when serializing the properties in the group. <tantek> Rossen_: please read the first one, which is about the behavior specifying, and how declaration blocks behave between shorthands and longhands and logical properties <tantek> fantasai: looks like I'm finding more pieces of it <tantek> emilio: the first one I assume every browser already does that <emilio> s/emilio/fremy <tantek> ... it's not clear from the spec, but I assume that should work regardless <fantasai> Third piece from fremy: When removing a shorthand property, all the longhand associated with that shorthand should be removed, regardless of their mapping kind. <TabAtkins> +1, all sound good <fantasai> Fourth piece from dbaron: appending a shorthand property could set all of its constituent shorthands of one mapping logic and also remove all of the constituent shorthands of the other. <tantek> Rossen_: any objections to accepting this first proposal <tantek> emilio: q, we are talking about shorthands that map to both physical and logical properties? but those do not exist in browser today <tantek> fremy: it's possible, back them we had proposal for margin, I don't know if we still have that <tantek> fantasai: we never figured out a syntax that was appropriate <tantek> fremy: that was mostly to make sure that case worked <tantek> ... I don't think it's wrong to add this even if we don't have the mechanism <tantek> emilio: not saying it's wrong, just possibly confusing <tantek> how would you test it? <tantek> RESOLVED: proposal from fremy: During serialization, each logical property group is considered, and shorthand values can be emitted instead of the longhands only if the all the longhands of the same mapping logic are present and consecutive (ignoring all properties that are not in the group). Otherwise, the shorthand is not used when serializing the properties in the group. <tantek> fremy: mostly the loop needs to be modified <tantek> Rossen_: wanting make sure everyone is comfortable with accepting this change <emilio> yeah, +1 for the serialization change, that's unobjectionable imo <fremy> https://www.w3.org/TR/cssom-1/#serialize-a-css-declaration-block <tantek> ... without delaying people too much, any objections or wait til Thu morning? <tantek> fremy: for me both is fine <Rossen_> RESOLVED: proposal from fremy:During serialization, each logical property group is considered, and shorthand values can be emitted instead of the longhands only if the all the longhands of the same mapping logic are present and consecutive (ignoring all properties that are not in the group). Otherwise, the shorthand is not used when serializing the properties in the group. |
… property group / mapping logic in between the longhands of that shorthand. Per #3030.
… property group / mapping logic in between the longhands of that shorthand. Per #3030.
Spec edits have been made, https://bugzilla.mozilla.org/show_bug.cgi?id=1675514 adds tests and fixes Gecko to follow the new spec text. |
@emilio Not sure if I get it the spec text right, taking for example this declaration block: margin-top: 10px;
margin-right: 10px;
margin-left: 10px;
margin-inline-start: 10px;
margin-block-start: 10px;
margin-block-end: 10px;
margin-inline-end: 10px;
margin-bottom: 10px So we reach the new step with
Then, we have mixed mapping logic, but all declarations in declaration block are in current longhands, so it seems to me we would serialize using |
@Loirooriol how so? if |
@emilio Didn't we decide this:
So |
I don't think we resolved on that, did we? The only shorthand that includes both logical and physical properties is |
Well that was the "First proposal from fremy" and I think we resolved it, though in the "RESOLVED" the wrong text was copied (so both resolutions are identical) |
So even if we resolved on this:
still it seems the new spec text isn't wrong as long as I still think the above proposal is wrong. |
On second thoughts, I did not consider |
As per w3c/csswg-drafts#3030. Also remove a system font special-case. It's generally handled in shorthands/font.mako.rs, and when it's not, it's really the same issue as w3c/csswg-drafts#2515. Browsers are all over the place for the system font case, so I think it's fine. Differential Revision: https://phabricator.services.mozilla.com/D96045 bugzilla-url: https://bugzilla.mozilla.org/show_bug.cgi?id=1675514 gecko-commit: 6dcbbdb84c453149f460f6868eeb135d6622c57d gecko-reviewers: boris
…ies. r=boris As per w3c/csswg-drafts#3030. Also remove a system font special-case. It's generally handled in shorthands/font.mako.rs, and when it's not, it's really the same issue as w3c/csswg-drafts#2515. Browsers are all over the place for the system font case, so I think it's fine. Differential Revision: https://phabricator.services.mozilla.com/D96045
As per w3c/csswg-drafts#3030. Also remove a system font special-case. It's generally handled in shorthands/font.mako.rs, and when it's not, it's really the same issue as w3c/csswg-drafts#2515. Browsers are all over the place for the system font case, so I think it's fine. Differential Revision: https://phabricator.services.mozilla.com/D96045 bugzilla-url: https://bugzilla.mozilla.org/show_bug.cgi?id=1675514 gecko-commit: 6dcbbdb84c453149f460f6868eeb135d6622c57d gecko-reviewers: boris
…ies. r=boris As per w3c/csswg-drafts#3030. Also remove a system font special-case. It's generally handled in shorthands/font.mako.rs, and when it's not, it's really the same issue as w3c/csswg-drafts#2515. Browsers are all over the place for the system font case, so I think it's fine. Differential Revision: https://phabricator.services.mozilla.com/D96045
As per w3c/csswg-drafts#3030. Also remove a system font special-case. It's generally handled in shorthands/font.mako.rs, and when it's not, it's really the same issue as w3c/csswg-drafts#2515. Browsers are all over the place for the system font case, so I think it's fine. Differential Revision: https://phabricator.services.mozilla.com/D96045
Relevant www-style threads:
https://lists.w3.org/Archives/Public/www-style/2014Dec/0319.html
https://lists.w3.org/Archives/Public/www-style/2014Dec/0369.html
The text was updated successfully, but these errors were encountered: