search

domenic / html-as-custom-elements

HTML as Custom Elements
https://domenic.github.io/html-as-custom-elements/
Apache License 2.0
260 stars 20 forks source link

Need logical-direction margin properties (and __qem?) #40

Open domenic opened 9 years ago

domenic commented 9 years ago

For example, in Blink, <blockquote> is 

custom-blockquote {
  display: block;
  -webkit-margin-before: 1__qem;
  -webkit-margin-after: 1em;
  -webkit-margin-start: 40px;
  -webkit-margin-end: 40px;
}

As @TabAtkins kindly explained, -webkit-margin-* are "logical" versions of the "physical" margin-{top,right,bottom,left} properties. This allows blockquotes to work better in different writing modes.

Notably, the HTML spec does not use these, so I guess the spec is wrong there. Although, it seems possible that if it wasn't for the __qem quirk, we'd be able to just use top/right/bottom/left, since in this case top = bottom and left = right?

There is a very-rough-sketch of standard versions of these properties in "CSS Logical Properties". It has been described as "half-copypasted and half-inconsistent (you can decide which half for each part)." ;)

annevk commented 9 years ago

Seems like a bug in HTML, normally it would say something like

dd { margin-left: 40px; } /* LTR-specific: use 'margin-right' for rtl elements */

I was thinking that maybe :dir() would be good enough for this, but I guess that does not handle vertical text.

How are you inserting these style sheets at the UA style sheet level of the cascade?

annevk commented 9 years ago

I filed https://www.w3.org/Bugs/Public/show_bug.cgi?id=27673 to get HTML fixed for these.

domenic commented 9 years ago

How are you inserting these style sheets at the UA style sheet level of the cascade?

That's #27.