mirror of
https://repo.dactyloidae.xyz/Dactyloidae/UXP.git
synced 2026-09-05 23:38:38 +09:00
Issue #2075 - Part 4: Update tests
* Update reftests to use inset-* * Update property database * Update logical properties test
This commit is contained in:
parent
48087df576
commit
1b22ef40f9
14 changed files with 257 additions and 221 deletions
|
|
@ -45,20 +45,20 @@ item3 { grid-area: 3 / 3; }
|
|||
.vlr { writing-mode: vertical-lr; direction:rtl; }
|
||||
.vrl { writing-mode: vertical-rl; direction:ltr; }
|
||||
|
||||
.aend *, .aflexend * { offset-block-start:25px; }
|
||||
.acenter * { offset-block-start:12.5px; }
|
||||
.aend *, .aflexend * { inset-block-start:25px; }
|
||||
.acenter * { inset-block-start:12.5px; }
|
||||
|
||||
|
||||
.aspace-between item2 { offset-block-start:12.5px; }
|
||||
.aspace-between item3 { offset-block-start:25px; }
|
||||
.aspace-between item2 { inset-block-start:12.5px; }
|
||||
.aspace-between item3 { inset-block-start:25px; }
|
||||
|
||||
.aspace-around item1 { offset-block-start:4.1666px; }
|
||||
.aspace-around item2 { offset-block-start:12.5px; }
|
||||
.aspace-around item3 { offset-block-start:20.8333px; }
|
||||
.aspace-around item1 { inset-block-start:4.1666px; }
|
||||
.aspace-around item2 { inset-block-start:12.5px; }
|
||||
.aspace-around item3 { inset-block-start:20.8333px; }
|
||||
|
||||
.aspace-evenly item1 { offset-block-start:6.25px; }
|
||||
.aspace-evenly item2 { offset-block-start:12.5px; }
|
||||
.aspace-evenly item3 { offset-block-start:18.75px; }
|
||||
.aspace-evenly item1 { inset-block-start:6.25px; }
|
||||
.aspace-evenly item2 { inset-block-start:12.5px; }
|
||||
.aspace-evenly item3 { inset-block-start:18.75px; }
|
||||
|
||||
.astretch2 { grid-template-rows: 1fr 5px 7px; }
|
||||
.astretch3 { grid-template-rows: 15.5px 17.5px 7px; }
|
||||
|
|
|
|||
|
|
@ -34,7 +34,7 @@ span {
|
|||
border-block-start: 2px solid blue;
|
||||
border-inline-start: 2px solid lime;
|
||||
margin: 1px 1px 2px 2px;
|
||||
offset-inline-start: 1px;
|
||||
inset-inline-start: 1px;
|
||||
}
|
||||
|
||||
abs1,abs2,abs3,abs4 {
|
||||
|
|
@ -63,11 +63,11 @@ abs4 { display:none; }
|
|||
|
||||
.astart,.aflexstart,.aleft,.aright,.astretch1,.astretch2,.astretch2,.astretch3,
|
||||
.astretch4,.astretch5,.astretch6,.astretch7,.aauto {
|
||||
offset-block-start: 3px;
|
||||
inset-block-start: 3px;
|
||||
}
|
||||
|
||||
.aend,.aflexend { offset-block-start: 9px; }
|
||||
.acenter { offset-block-start: 5px; margin-block-start:2px; }
|
||||
.aend,.aflexend { inset-block-start: 9px; }
|
||||
.acenter { inset-block-start: 5px; margin-block-start:2px; }
|
||||
|
||||
.hl .astretch2, .hr .astretch2 { height: 15px; }
|
||||
.hl .astretch3, .hr .astretch3 { height: 15px; }
|
||||
|
|
@ -80,7 +80,7 @@ abs4 { display:none; }
|
|||
.astretch7 { width:0; height:9px; }
|
||||
|
||||
.hl .hr {margin-left:4px;}
|
||||
.hl .vl {offset-block-start: 1px; offset-inline-start:3px;}
|
||||
.hl .vl {inset-block-start: 1px; inset-inline-start:3px;}
|
||||
.hl .vl.aend, .hl .vl.aflexend { margin-top: 7px; }
|
||||
.hl .vl.acenter { margin-top:4px; }
|
||||
|
||||
|
|
@ -115,7 +115,7 @@ abs4 { display:none; }
|
|||
.hr .vrl.aend, .hr .vrl.aflexend {margin-top:9px; margin-right:-7px; }
|
||||
.hr .vrl.acenter {margin-top:6px; margin-right:-3px; }
|
||||
|
||||
.vl span { offset-block-start: 1px; offset-inline-start: 3px; }
|
||||
.vl span { inset-block-start: 1px; inset-inline-start: 3px; }
|
||||
.vl .astretch4 { width:15px; }
|
||||
.vl .astretch5 { width:13px; }
|
||||
|
||||
|
|
|
|||
|
|
@ -28,7 +28,7 @@ separator { clear:both; display:block; height:6px; }
|
|||
wrap {
|
||||
display: block;
|
||||
position: relative;
|
||||
offset-inline-start:1px;
|
||||
inset-inline-start:1px;
|
||||
background: white;
|
||||
block-size:20px;
|
||||
inline-size:32px;
|
||||
|
|
|
|||
|
|
@ -29,7 +29,7 @@ separator { clear:both; display:block; height:6px; }
|
|||
wrap {
|
||||
display: block;
|
||||
position: relative;
|
||||
offset-inline-start:1px;
|
||||
inset-inline-start:1px;
|
||||
background: white;
|
||||
block-size:20px;
|
||||
inline-size:32px;
|
||||
|
|
@ -65,10 +65,10 @@ abs4 { right: 35px; }
|
|||
.vlr { writing-mode: vertical-lr; direction:rtl; }
|
||||
.vrl { writing-mode: vertical-rl; direction:ltr; }
|
||||
|
||||
.unsafe.hl.aend, .unsafe.hl.aflexend { offset-block-start:-15px; }
|
||||
.unsafe.vrl.aend, .unsafe.vrl.aflexend { offset-inline-start:-15px; }
|
||||
.unsafe.hl.acenter { offset-block-start:-7px; }
|
||||
.unsafe.vrl.acenter { offset-inline-start:-7px; }
|
||||
.unsafe.hl.aend, .unsafe.hl.aflexend { inset-block-start:-15px; }
|
||||
.unsafe.vrl.aend, .unsafe.vrl.aflexend { inset-inline-start:-15px; }
|
||||
.unsafe.hl.acenter { inset-block-start:-7px; }
|
||||
.unsafe.vrl.acenter { inset-inline-start:-7px; }
|
||||
.astretch2 { width:40px; height:15px; }
|
||||
.astretch3 { height:15px; }
|
||||
.astretch4 { width:0; }
|
||||
|
|
|
|||
|
|
@ -29,7 +29,7 @@ separator { clear:both; display:block; height:6px; }
|
|||
wrap {
|
||||
display: block;
|
||||
position: relative;
|
||||
offset-inline-start: 1px;
|
||||
inset-inline-start: 1px;
|
||||
background: white;
|
||||
block-size: 20px;
|
||||
inline-size: 32px;
|
||||
|
|
|
|||
|
|
@ -29,7 +29,7 @@ separator { clear:both; display:block; height:6px; }
|
|||
wrap {
|
||||
display: block;
|
||||
position: relative;
|
||||
offset-inline-start: 1px;
|
||||
inset-inline-start: 1px;
|
||||
background: white;
|
||||
block-size: 20px;
|
||||
inline-size: 32px;
|
||||
|
|
|
|||
|
|
@ -45,21 +45,21 @@ item3 { grid-area: 3 / 3; }
|
|||
.vlr { writing-mode: vertical-lr; direction:rtl; }
|
||||
.vrl { writing-mode: vertical-rl; direction:ltr; }
|
||||
|
||||
.jend * , .jflexend * { offset-inline-start:17px; }
|
||||
.jcenter * { offset-inline-start:8.5px; }
|
||||
.hr.jleft * , .vlr.jleft * { offset-inline-start:17px; }
|
||||
.hl.jright * , .vrl.jright * , .vl.jright * , .vr.jright * { offset-inline-start:17px; }
|
||||
.jend * , .jflexend * { inset-inline-start:17px; }
|
||||
.jcenter * { inset-inline-start:8.5px; }
|
||||
.hr.jleft * , .vlr.jleft * { inset-inline-start:17px; }
|
||||
.hl.jright * , .vrl.jright * , .vl.jright * , .vr.jright * { inset-inline-start:17px; }
|
||||
|
||||
.jspace-between item2 { offset-inline-start:8.5px; }
|
||||
.jspace-between item3 { offset-inline-start:17px; }
|
||||
.jspace-between item2 { inset-inline-start:8.5px; }
|
||||
.jspace-between item3 { inset-inline-start:17px; }
|
||||
|
||||
.jspace-around item1 { offset-inline-start:2.85px; }
|
||||
.jspace-around item2 { offset-inline-start:8.5px; }
|
||||
.jspace-around item3 { offset-inline-start:14.16px; }
|
||||
.jspace-around item1 { inset-inline-start:2.85px; }
|
||||
.jspace-around item2 { inset-inline-start:8.5px; }
|
||||
.jspace-around item3 { inset-inline-start:14.16px; }
|
||||
|
||||
.jspace-evenly item1 { offset-inline-start:4.25px; }
|
||||
.jspace-evenly item2 { offset-inline-start:8.5px; }
|
||||
.jspace-evenly item3 { offset-inline-start:12.75px; }
|
||||
.jspace-evenly item1 { inset-inline-start:4.25px; }
|
||||
.jspace-evenly item2 { inset-inline-start:8.5px; }
|
||||
.jspace-evenly item3 { inset-inline-start:12.75px; }
|
||||
|
||||
.jstretch2 { grid-template-columns:1fr 7px 5px; }
|
||||
.jstretch3 { grid-template-columns:19.5px 15.5px 5px; }
|
||||
|
|
|
|||
|
|
@ -45,20 +45,20 @@ item3 { grid-area: 5 / 3; }
|
|||
.vlr { writing-mode: vertical-lr; direction:rtl; }
|
||||
.vrl { writing-mode: vertical-rl; direction:ltr; }
|
||||
|
||||
.aend *, .aflexend * { offset-block-start:23px; }
|
||||
.acenter * { offset-block-start:11.5px; }
|
||||
.aend *, .aflexend * { inset-block-start:23px; }
|
||||
.acenter * { inset-block-start:11.5px; }
|
||||
|
||||
|
||||
.aspace-between item2 { offset-block-start:11.5px; }
|
||||
.aspace-between item3 { offset-block-start:23px; }
|
||||
.aspace-between item2 { inset-block-start:11.5px; }
|
||||
.aspace-between item3 { inset-block-start:23px; }
|
||||
|
||||
.aspace-around item1 { offset-block-start:4.1666px; }
|
||||
.aspace-around item2 { offset-block-start:11.5px; }
|
||||
.aspace-around item3 { offset-block-start:18.8333px; }
|
||||
.aspace-around item1 { inset-block-start:4.1666px; }
|
||||
.aspace-around item2 { inset-block-start:11.5px; }
|
||||
.aspace-around item3 { inset-block-start:18.8333px; }
|
||||
|
||||
.aspace-evenly item1 { offset-block-start:6.25px; }
|
||||
.aspace-evenly item2 { offset-block-start:11.5px; }
|
||||
.aspace-evenly item3 { offset-block-start:16.75px; }
|
||||
.aspace-evenly item1 { inset-block-start:6.25px; }
|
||||
.aspace-evenly item2 { inset-block-start:11.5px; }
|
||||
.aspace-evenly item3 { inset-block-start:16.75px; }
|
||||
|
||||
.astretch2 { grid-template-rows: 1fr 1px 5px 1px 7px; }
|
||||
.astretch3 { grid-template-rows: 14.5px 1px 16.3333px 1px 7px; }
|
||||
|
|
|
|||
|
|
@ -21,126 +21,126 @@ span {
|
|||
}
|
||||
|
||||
.test1 .a {
|
||||
offset-block-start: 0;
|
||||
offset-inline-start: 20px;
|
||||
inset-block-start: 0;
|
||||
inset-inline-start: 20px;
|
||||
inline-size: 20px;
|
||||
block-size: 20px;
|
||||
}
|
||||
.test1 .b {
|
||||
offset-block-start: 20px;
|
||||
offset-inline-start: 20px;
|
||||
inset-block-start: 20px;
|
||||
inset-inline-start: 20px;
|
||||
inline-size: 60px;
|
||||
block-size: 20px;
|
||||
}
|
||||
.test1 .c {
|
||||
offset-block-start: 0;
|
||||
offset-inline-start: 80px;
|
||||
inset-block-start: 0;
|
||||
inset-inline-start: 80px;
|
||||
inline-size: 60px;
|
||||
block-size: 40px;
|
||||
}
|
||||
.test1 .e {
|
||||
offset-block-start: 20px;
|
||||
offset-inline-start: 0px;
|
||||
inset-block-start: 20px;
|
||||
inset-inline-start: 0px;
|
||||
}
|
||||
.test1 .d2 {
|
||||
offset-block-start: 0px;
|
||||
offset-inline-start: 40px;
|
||||
inset-block-start: 0px;
|
||||
inset-inline-start: 40px;
|
||||
}
|
||||
|
||||
.test2 .a {
|
||||
offset-block-start: 0;
|
||||
offset-inline-start: 20px;
|
||||
inset-block-start: 0;
|
||||
inset-inline-start: 20px;
|
||||
inline-size: 60px;
|
||||
block-size: 20px;
|
||||
}
|
||||
.test2 .b {
|
||||
offset-block-start: 20px;
|
||||
offset-inline-start: 20px;
|
||||
inset-block-start: 20px;
|
||||
inset-inline-start: 20px;
|
||||
inline-size: 20px;
|
||||
block-size: 20px;
|
||||
}
|
||||
.test2 .c {
|
||||
offset-block-start: 0;
|
||||
offset-inline-start: 80px;
|
||||
inset-block-start: 0;
|
||||
inset-inline-start: 80px;
|
||||
inline-size: 60px;
|
||||
block-size: 40px;
|
||||
}
|
||||
.test2 .e {
|
||||
offset-block-start: 20px;
|
||||
offset-inline-start: 0px;
|
||||
inset-block-start: 20px;
|
||||
inset-inline-start: 0px;
|
||||
}
|
||||
.test2 .d2 {
|
||||
offset-block-start: 20px;
|
||||
offset-inline-start: 40px;
|
||||
inset-block-start: 20px;
|
||||
inset-inline-start: 40px;
|
||||
}
|
||||
|
||||
.test3 .a {
|
||||
offset-block-start: 0;
|
||||
offset-inline-start: 0;
|
||||
inset-block-start: 0;
|
||||
inset-inline-start: 0;
|
||||
inline-size: 60px;
|
||||
block-size: 40px;
|
||||
}
|
||||
.test3 .b {
|
||||
offset-block-start: 40px;
|
||||
offset-inline-start: 20px;
|
||||
inset-block-start: 40px;
|
||||
inset-inline-start: 20px;
|
||||
inline-size: 60px;
|
||||
block-size: 20px;
|
||||
}
|
||||
.test3 .c {
|
||||
offset-block-start: 60px;
|
||||
offset-inline-start: 0px;
|
||||
inset-block-start: 60px;
|
||||
inset-inline-start: 0px;
|
||||
inline-size: 60px;
|
||||
block-size: 40px;
|
||||
}
|
||||
.test3 .d { offset-block-start: 60px; offset-inline-start:60px; }
|
||||
.test3 .d { inset-block-start: 60px; inset-inline-start:60px; }
|
||||
.test3 .e {
|
||||
offset-block-start: 20px;
|
||||
offset-inline-start: 60px;
|
||||
inset-block-start: 20px;
|
||||
inset-inline-start: 60px;
|
||||
}
|
||||
.test3 .d2 {
|
||||
offset-block-start: 80px;
|
||||
offset-inline-start: 60px;
|
||||
inset-block-start: 80px;
|
||||
inset-inline-start: 60px;
|
||||
}
|
||||
|
||||
.test4 .c {
|
||||
offset-block-start: 0;
|
||||
offset-inline-start: 20px;
|
||||
inset-block-start: 0;
|
||||
inset-inline-start: 20px;
|
||||
inline-size: 60px;
|
||||
block-size: 40px;
|
||||
}
|
||||
.test4 .d { offset-block-start: 40px; }
|
||||
.test4 .d { inset-block-start: 40px; }
|
||||
.test4 .e {
|
||||
offset-block-start: 20px;
|
||||
offset-inline-start: 0px;
|
||||
inset-block-start: 20px;
|
||||
inset-inline-start: 0px;
|
||||
}
|
||||
.test4 .d2 {
|
||||
offset-block-start: 40px;
|
||||
offset-inline-start: 20px;
|
||||
inset-block-start: 40px;
|
||||
inset-inline-start: 20px;
|
||||
}
|
||||
|
||||
.test5 .c {
|
||||
offset-block-start: 20px;
|
||||
offset-inline-start: 0;
|
||||
inset-block-start: 20px;
|
||||
inset-inline-start: 0;
|
||||
inline-size: 60px;
|
||||
block-size: 20px;
|
||||
}
|
||||
.test5 .e {
|
||||
offset-block-start: 20px;
|
||||
offset-inline-start: 60px;
|
||||
inset-block-start: 20px;
|
||||
inset-inline-start: 60px;
|
||||
}
|
||||
.test5 .d2 {
|
||||
offset-block-start: 0px;
|
||||
offset-inline-start: 20px;
|
||||
inset-block-start: 0px;
|
||||
inset-inline-start: 20px;
|
||||
}
|
||||
|
||||
.test6 { offset-inline-start: 0px; offset-block-start: 20px;}
|
||||
.test6 { inset-inline-start: 0px; inset-block-start: 20px;}
|
||||
.test6d2 {
|
||||
offset-block-start: 20px;
|
||||
offset-inline-start: 140px;
|
||||
inset-block-start: 20px;
|
||||
inset-inline-start: 140px;
|
||||
}
|
||||
.test6e {
|
||||
offset-block-start: 20px;
|
||||
offset-inline-start: 160px;
|
||||
inset-block-start: 20px;
|
||||
inset-inline-start: 160px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
|
|
|||
|
|
@ -24,26 +24,26 @@ span {
|
|||
}
|
||||
|
||||
.a {
|
||||
offset-inline-start: 40px;
|
||||
offset-block-start: 0px;
|
||||
inset-inline-start: 40px;
|
||||
inset-block-start: 0px;
|
||||
inline-size: 60px;
|
||||
block-size: 40px;
|
||||
}
|
||||
.b {
|
||||
offset-inline-start: 20px;
|
||||
offset-block-start: 40px;
|
||||
inset-inline-start: 20px;
|
||||
inset-block-start: 40px;
|
||||
inline-size: 60px;
|
||||
block-size: 20px;
|
||||
}
|
||||
.c {
|
||||
offset-inline-start: 80px;
|
||||
offset-block-start: 40px;
|
||||
inset-inline-start: 80px;
|
||||
inset-block-start: 40px;
|
||||
inline-size: 60px;
|
||||
block-size: 20px;
|
||||
}
|
||||
.d {
|
||||
offset-inline-start: 0px;
|
||||
offset-block-start: 0px;
|
||||
inset-inline-start: 0px;
|
||||
inset-block-start: 0px;
|
||||
inline-size: 20px;
|
||||
block-size: 60px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -25,126 +25,126 @@ span {
|
|||
}
|
||||
|
||||
.test1 .a {
|
||||
offset-block-start: 0;
|
||||
offset-inline-start: 20px;
|
||||
inset-block-start: 0;
|
||||
inset-inline-start: 20px;
|
||||
inline-size: 20px;
|
||||
block-size: 20px;
|
||||
}
|
||||
.test1 .b {
|
||||
offset-block-start: 20px;
|
||||
offset-inline-start: 20px;
|
||||
inset-block-start: 20px;
|
||||
inset-inline-start: 20px;
|
||||
inline-size: 60px;
|
||||
block-size: 20px;
|
||||
}
|
||||
.test1 .c {
|
||||
offset-block-start: 0;
|
||||
offset-inline-start: 80px;
|
||||
inset-block-start: 0;
|
||||
inset-inline-start: 80px;
|
||||
inline-size: 60px;
|
||||
block-size: 40px;
|
||||
}
|
||||
.test1 .e {
|
||||
offset-block-start: 20px;
|
||||
offset-inline-start: 0px;
|
||||
inset-block-start: 20px;
|
||||
inset-inline-start: 0px;
|
||||
}
|
||||
.test1 .d2 {
|
||||
offset-block-start: 0px;
|
||||
offset-inline-start: 40px;
|
||||
inset-block-start: 0px;
|
||||
inset-inline-start: 40px;
|
||||
}
|
||||
|
||||
.test2 .a {
|
||||
offset-block-start: 0;
|
||||
offset-inline-start: 20px;
|
||||
inset-block-start: 0;
|
||||
inset-inline-start: 20px;
|
||||
inline-size: 60px;
|
||||
block-size: 20px;
|
||||
}
|
||||
.test2 .b {
|
||||
offset-block-start: 20px;
|
||||
offset-inline-start: 20px;
|
||||
inset-block-start: 20px;
|
||||
inset-inline-start: 20px;
|
||||
inline-size: 20px;
|
||||
block-size: 20px;
|
||||
}
|
||||
.test2 .c {
|
||||
offset-block-start: 0;
|
||||
offset-inline-start: 80px;
|
||||
inset-block-start: 0;
|
||||
inset-inline-start: 80px;
|
||||
inline-size: 60px;
|
||||
block-size: 40px;
|
||||
}
|
||||
.test2 .e {
|
||||
offset-block-start: 20px;
|
||||
offset-inline-start: 0px;
|
||||
inset-block-start: 20px;
|
||||
inset-inline-start: 0px;
|
||||
}
|
||||
.test2 .d2 {
|
||||
offset-block-start: 20px;
|
||||
offset-inline-start: 40px;
|
||||
inset-block-start: 20px;
|
||||
inset-inline-start: 40px;
|
||||
}
|
||||
|
||||
.test3 .a {
|
||||
offset-block-start: 0;
|
||||
offset-inline-start: 0;
|
||||
inset-block-start: 0;
|
||||
inset-inline-start: 0;
|
||||
inline-size: 60px;
|
||||
block-size: 40px;
|
||||
}
|
||||
.test3 .b {
|
||||
offset-block-start: 40px;
|
||||
offset-inline-start: 20px;
|
||||
inset-block-start: 40px;
|
||||
inset-inline-start: 20px;
|
||||
inline-size: 60px;
|
||||
block-size: 20px;
|
||||
}
|
||||
.test3 .c {
|
||||
offset-block-start: 60px;
|
||||
offset-inline-start: 0px;
|
||||
inset-block-start: 60px;
|
||||
inset-inline-start: 0px;
|
||||
inline-size: 60px;
|
||||
block-size: 40px;
|
||||
}
|
||||
.test3 .d { offset-block-start: 60px; offset-inline-start:60px; }
|
||||
.test3 .d { inset-block-start: 60px; inset-inline-start:60px; }
|
||||
.test3 .e {
|
||||
offset-block-start: 20px;
|
||||
offset-inline-start: 60px;
|
||||
inset-block-start: 20px;
|
||||
inset-inline-start: 60px;
|
||||
}
|
||||
.test3 .d2 {
|
||||
offset-block-start: 80px;
|
||||
offset-inline-start: 60px;
|
||||
inset-block-start: 80px;
|
||||
inset-inline-start: 60px;
|
||||
}
|
||||
|
||||
.test4 .c {
|
||||
offset-block-start: 0;
|
||||
offset-inline-start: 20px;
|
||||
inset-block-start: 0;
|
||||
inset-inline-start: 20px;
|
||||
inline-size: 60px;
|
||||
block-size: 40px;
|
||||
}
|
||||
.test4 .d { offset-block-start: 40px; }
|
||||
.test4 .d { inset-block-start: 40px; }
|
||||
.test4 .e {
|
||||
offset-block-start: 20px;
|
||||
offset-inline-start: 0px;
|
||||
inset-block-start: 20px;
|
||||
inset-inline-start: 0px;
|
||||
}
|
||||
.test4 .d2 {
|
||||
offset-block-start: 40px;
|
||||
offset-inline-start: 20px;
|
||||
inset-block-start: 40px;
|
||||
inset-inline-start: 20px;
|
||||
}
|
||||
|
||||
.test5 .c {
|
||||
offset-block-start: 20px;
|
||||
offset-inline-start: 0;
|
||||
inset-block-start: 20px;
|
||||
inset-inline-start: 0;
|
||||
inline-size: 60px;
|
||||
block-size: 20px;
|
||||
}
|
||||
.test5 .e {
|
||||
offset-block-start: 20px;
|
||||
offset-inline-start: 60px;
|
||||
inset-block-start: 20px;
|
||||
inset-inline-start: 60px;
|
||||
}
|
||||
.test5 .d2 {
|
||||
offset-block-start: 0px;
|
||||
offset-inline-start: 20px;
|
||||
inset-block-start: 0px;
|
||||
inset-inline-start: 20px;
|
||||
}
|
||||
|
||||
.test6 { offset-inline-start: 0px; offset-block-start: 20px;}
|
||||
.test6 { inset-inline-start: 0px; inset-block-start: 20px;}
|
||||
.test6d2 {
|
||||
offset-block-start: 20px;
|
||||
offset-inline-start: 140px;
|
||||
inset-block-start: 20px;
|
||||
inset-inline-start: 140px;
|
||||
}
|
||||
.test6e {
|
||||
offset-block-start: 20px;
|
||||
offset-inline-start: 160px;
|
||||
inset-block-start: 20px;
|
||||
inset-inline-start: 160px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
|
|
|||
|
|
@ -25,144 +25,144 @@ span {
|
|||
}
|
||||
|
||||
.test1 .a {
|
||||
offset-block-start: 0;
|
||||
offset-inline-start: 20px;
|
||||
inset-block-start: 0;
|
||||
inset-inline-start: 20px;
|
||||
inline-size: 20px;
|
||||
block-size: 20px;
|
||||
}
|
||||
.test1 .b {
|
||||
offset-block-start: 20px;
|
||||
offset-inline-start: 20px;
|
||||
inset-block-start: 20px;
|
||||
inset-inline-start: 20px;
|
||||
inline-size: 60px;
|
||||
block-size: 20px;
|
||||
}
|
||||
.test1 .c {
|
||||
offset-block-start: 0;
|
||||
offset-inline-start: 80px;
|
||||
inset-block-start: 0;
|
||||
inset-inline-start: 80px;
|
||||
inline-size: 60px;
|
||||
block-size: 40px;
|
||||
}
|
||||
.test1 .d {
|
||||
offset-block-start: 0;
|
||||
offset-inline-start: 0;
|
||||
inset-block-start: 0;
|
||||
inset-inline-start: 0;
|
||||
}
|
||||
.test1 .e {
|
||||
offset-block-start: 20px;
|
||||
offset-inline-start: 0;
|
||||
inset-block-start: 20px;
|
||||
inset-inline-start: 0;
|
||||
}
|
||||
.test1 .d2 {
|
||||
offset-block-start: 0;
|
||||
offset-inline-start: 40px;
|
||||
inset-block-start: 0;
|
||||
inset-inline-start: 40px;
|
||||
}
|
||||
|
||||
.test2 .a {
|
||||
offset-block-start: 0;
|
||||
offset-inline-start: 20px;
|
||||
inset-block-start: 0;
|
||||
inset-inline-start: 20px;
|
||||
inline-size: 60px;
|
||||
block-size: 20px;
|
||||
}
|
||||
.test2 .b {
|
||||
offset-block-start: 20px;
|
||||
offset-inline-start: 20px;
|
||||
inset-block-start: 20px;
|
||||
inset-inline-start: 20px;
|
||||
inline-size: 20px;
|
||||
block-size: 20px;
|
||||
}
|
||||
.test2 .c {
|
||||
offset-block-start: 0;
|
||||
offset-inline-start: 80px;
|
||||
inset-block-start: 0;
|
||||
inset-inline-start: 80px;
|
||||
inline-size: 60px;
|
||||
block-size: 40px;
|
||||
}
|
||||
.test2 .d {
|
||||
offset-block-start: 0;
|
||||
offset-inline-start: 0;
|
||||
inset-block-start: 0;
|
||||
inset-inline-start: 0;
|
||||
}
|
||||
.test2 .e {
|
||||
offset-block-start: 20px;
|
||||
offset-inline-start: 0;
|
||||
inset-block-start: 20px;
|
||||
inset-inline-start: 0;
|
||||
}
|
||||
.test2 .d2 {
|
||||
offset-block-start: 20px;
|
||||
offset-inline-start: 40px;
|
||||
inset-block-start: 20px;
|
||||
inset-inline-start: 40px;
|
||||
}
|
||||
|
||||
.test3 .a {
|
||||
offset-block-start: 0;
|
||||
offset-inline-start: 0;
|
||||
inset-block-start: 0;
|
||||
inset-inline-start: 0;
|
||||
inline-size: 60px;
|
||||
block-size: 40px;
|
||||
}
|
||||
.test3 .b {
|
||||
offset-block-start: 40px;
|
||||
offset-inline-start: 20px;
|
||||
inset-block-start: 40px;
|
||||
inset-inline-start: 20px;
|
||||
inline-size: 60px;
|
||||
block-size: 20px;
|
||||
}
|
||||
.test3 .c {
|
||||
offset-block-start: 60px;
|
||||
offset-inline-start: 0;
|
||||
inset-block-start: 60px;
|
||||
inset-inline-start: 0;
|
||||
inline-size: 60px;
|
||||
block-size: 40px;
|
||||
}
|
||||
.test3 .d { offset-block-start: 60px; offset-inline-start:60px; }
|
||||
.test3 .d { inset-block-start: 60px; inset-inline-start:60px; }
|
||||
.test3 .e {
|
||||
offset-block-start: 20px;
|
||||
offset-inline-start: 60px;
|
||||
inset-block-start: 20px;
|
||||
inset-inline-start: 60px;
|
||||
}
|
||||
.test3 .d2 {
|
||||
offset-block-start: 80px;
|
||||
offset-inline-start: 60px;
|
||||
inset-block-start: 80px;
|
||||
inset-inline-start: 60px;
|
||||
}
|
||||
|
||||
.test4 .c {
|
||||
offset-block-start: 0;
|
||||
offset-inline-start: 20px;
|
||||
inset-block-start: 0;
|
||||
inset-inline-start: 20px;
|
||||
inline-size: 60px;
|
||||
block-size: 40px;
|
||||
}
|
||||
.test4 .d {
|
||||
offset-block-start: 40px;
|
||||
offset-inline-start: 0;
|
||||
inset-block-start: 40px;
|
||||
inset-inline-start: 0;
|
||||
}
|
||||
.test4 .e {
|
||||
offset-block-start: 20px;
|
||||
offset-inline-start: 0px;
|
||||
inset-block-start: 20px;
|
||||
inset-inline-start: 0px;
|
||||
}
|
||||
.test4 .d2 {
|
||||
offset-block-start: 40px;
|
||||
offset-inline-start: 20px;
|
||||
inset-block-start: 40px;
|
||||
inset-inline-start: 20px;
|
||||
}
|
||||
|
||||
.test5 .c {
|
||||
offset-block-start: 20px;
|
||||
offset-inline-start: 0;
|
||||
inset-block-start: 20px;
|
||||
inset-inline-start: 0;
|
||||
inline-size: 60px;
|
||||
block-size: 20px;
|
||||
}
|
||||
.test5 .d {
|
||||
offset-block-start: 0;
|
||||
offset-inline-start: 0;
|
||||
inset-block-start: 0;
|
||||
inset-inline-start: 0;
|
||||
}
|
||||
.test5 .e {
|
||||
offset-block-start: 20px;
|
||||
offset-inline-start: 60px;
|
||||
inset-block-start: 20px;
|
||||
inset-inline-start: 60px;
|
||||
}
|
||||
.test5 .d2 {
|
||||
offset-block-start: 0;
|
||||
offset-inline-start: 20px;
|
||||
inset-block-start: 0;
|
||||
inset-inline-start: 20px;
|
||||
}
|
||||
|
||||
.test6 {
|
||||
offset-inline-start: 0;
|
||||
offset-block-start: 20px;
|
||||
inset-inline-start: 0;
|
||||
inset-block-start: 20px;
|
||||
}
|
||||
.test6d2 {
|
||||
offset-block-start: 20px;
|
||||
offset-inline-start: 140px;
|
||||
inset-block-start: 20px;
|
||||
inset-inline-start: 140px;
|
||||
}
|
||||
.test6e {
|
||||
offset-block-start: 20px;
|
||||
offset-inline-start: 160px;
|
||||
inset-block-start: 20px;
|
||||
inset-inline-start: 160px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
|
|
|||
|
|
@ -5403,8 +5403,68 @@ var gCSSProperties = {
|
|||
],
|
||||
invalid_values: [ "none", "5" ]
|
||||
},
|
||||
"offset-block-end": {
|
||||
domProp: "offsetBlockEnd",
|
||||
"inset-block-end": {
|
||||
domProp: "insetBlockEnd",
|
||||
inherited: false,
|
||||
type: CSS_TYPE_LONGHAND,
|
||||
logical: true,
|
||||
get_computed: logical_box_prop_get_computed,
|
||||
/* FIXME: run tests with multiple prerequisites */
|
||||
prerequisites: { "position": "relative" },
|
||||
/* XXX 0 may or may not be equal to auto */
|
||||
initial_values: [ "auto" ],
|
||||
other_values: [ "32px", "-3em", "12%",
|
||||
"calc(2px)",
|
||||
"calc(-2px)",
|
||||
"calc(50%)",
|
||||
"calc(3*25px)",
|
||||
"calc(25px*3)",
|
||||
"calc(3*25px + 50%)",
|
||||
],
|
||||
invalid_values: []
|
||||
},
|
||||
"inset-block-start": {
|
||||
domProp: "insetBlockStart",
|
||||
inherited: false,
|
||||
type: CSS_TYPE_LONGHAND,
|
||||
logical: true,
|
||||
get_computed: logical_box_prop_get_computed,
|
||||
/* FIXME: run tests with multiple prerequisites */
|
||||
prerequisites: { "position": "relative" },
|
||||
/* XXX 0 may or may not be equal to auto */
|
||||
initial_values: [ "auto" ],
|
||||
other_values: [ "32px", "-3em", "12%",
|
||||
"calc(2px)",
|
||||
"calc(-2px)",
|
||||
"calc(50%)",
|
||||
"calc(3*25px)",
|
||||
"calc(25px*3)",
|
||||
"calc(3*25px + 50%)",
|
||||
],
|
||||
invalid_values: []
|
||||
},
|
||||
"inset-inline-end": {
|
||||
domProp: "insetInlineEnd",
|
||||
inherited: false,
|
||||
type: CSS_TYPE_LONGHAND,
|
||||
logical: true,
|
||||
get_computed: logical_box_prop_get_computed,
|
||||
/* FIXME: run tests with multiple prerequisites */
|
||||
prerequisites: { "position": "relative" },
|
||||
/* XXX 0 may or may not be equal to auto */
|
||||
initial_values: [ "auto" ],
|
||||
other_values: [ "32px", "-3em", "12%",
|
||||
"calc(2px)",
|
||||
"calc(-2px)",
|
||||
"calc(50%)",
|
||||
"calc(3*25px)",
|
||||
"calc(25px*3)",
|
||||
"calc(3*25px + 50%)",
|
||||
],
|
||||
invalid_values: []
|
||||
},
|
||||
"inset-inline-start": {
|
||||
domProp: "insetInlineStart",
|
||||
inherited: false,
|
||||
type: CSS_TYPE_LONGHAND,
|
||||
logical: true,
|
||||
|
|
@ -5426,62 +5486,38 @@ var gCSSProperties = {
|
|||
"offset-block-start": {
|
||||
domProp: "offsetBlockStart",
|
||||
inherited: false,
|
||||
type: CSS_TYPE_LONGHAND,
|
||||
type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
|
||||
logical: true,
|
||||
get_computed: logical_box_prop_get_computed,
|
||||
/* FIXME: run tests with multiple prerequisites */
|
||||
prerequisites: { "position": "relative" },
|
||||
/* XXX 0 may or may not be equal to auto */
|
||||
initial_values: [ "auto" ],
|
||||
other_values: [ "32px", "-3em", "12%",
|
||||
"calc(2px)",
|
||||
"calc(-2px)",
|
||||
"calc(50%)",
|
||||
"calc(3*25px)",
|
||||
"calc(25px*3)",
|
||||
"calc(3*25px + 50%)",
|
||||
],
|
||||
invalid_values: []
|
||||
alias_for: "inset-block-start",
|
||||
subproperties: [ "inset-block-start" ],
|
||||
},
|
||||
"offset-inline-end": {
|
||||
domProp: "offsetInlineEnd",
|
||||
"offset-block-end": {
|
||||
domProp: "offsetBlockEnd",
|
||||
inherited: false,
|
||||
type: CSS_TYPE_LONGHAND,
|
||||
type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
|
||||
logical: true,
|
||||
get_computed: logical_box_prop_get_computed,
|
||||
/* FIXME: run tests with multiple prerequisites */
|
||||
prerequisites: { "position": "relative" },
|
||||
/* XXX 0 may or may not be equal to auto */
|
||||
initial_values: [ "auto" ],
|
||||
other_values: [ "32px", "-3em", "12%",
|
||||
"calc(2px)",
|
||||
"calc(-2px)",
|
||||
"calc(50%)",
|
||||
"calc(3*25px)",
|
||||
"calc(25px*3)",
|
||||
"calc(3*25px + 50%)",
|
||||
],
|
||||
invalid_values: []
|
||||
alias_for: "inset-block-end",
|
||||
subproperties: [ "inset-block-end" ],
|
||||
},
|
||||
"offset-inline-start": {
|
||||
domProp: "offsetInlineStart",
|
||||
inherited: false,
|
||||
type: CSS_TYPE_LONGHAND,
|
||||
type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
|
||||
logical: true,
|
||||
get_computed: logical_box_prop_get_computed,
|
||||
/* FIXME: run tests with multiple prerequisites */
|
||||
prerequisites: { "position": "relative" },
|
||||
/* XXX 0 may or may not be equal to auto */
|
||||
initial_values: [ "auto" ],
|
||||
other_values: [ "32px", "-3em", "12%",
|
||||
"calc(2px)",
|
||||
"calc(-2px)",
|
||||
"calc(50%)",
|
||||
"calc(3*25px)",
|
||||
"calc(25px*3)",
|
||||
"calc(3*25px + 50%)",
|
||||
],
|
||||
invalid_values: []
|
||||
alias_for: "inset-inline-start",
|
||||
subproperties: [ "inset-inline-start" ],
|
||||
},
|
||||
"offset-inline-end": {
|
||||
domProp: "offsetInlineEnd",
|
||||
inherited: false,
|
||||
type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
|
||||
logical: true,
|
||||
get_computed: logical_box_prop_get_computed,
|
||||
alias_for: "inset-inline-end",
|
||||
subproperties: [ "inset-inline-end" ],
|
||||
},
|
||||
"padding-block-end": {
|
||||
domProp: "paddingBlockEnd",
|
||||
|
|
@ -5635,8 +5671,8 @@ function logical_box_prop_get_computed(cs, property)
|
|||
|
||||
if (/^-moz-/.test(property)) {
|
||||
property = physicalize(property.substring(5), inlineMapping, "");
|
||||
} else if (/^offset-(block|inline)-(start|end)/.test(property)) {
|
||||
property = property.substring(7); // we want "top" not "offset-top", e.g.
|
||||
} else if (/^(offset|inset)-(block|inline)-(start|end)/.test(property)) {
|
||||
property = property.replace("offset-", "").replace("inset-", ""); // we want "top" not "offset-top", e.g.
|
||||
property = physicalize(property, blockMapping, "block-");
|
||||
property = physicalize(property, inlineMapping, "inline-");
|
||||
} else if (/-(block|inline)-(start|end)/.test(property)) {
|
||||
|
|
|
|||
|
|
@ -94,7 +94,7 @@ function init() {
|
|||
type == CSS_TYPE_LONGHAND && gCSSProperties[p].logical) &&
|
||||
/-inline-end/.test(p)) {
|
||||
var valueType;
|
||||
if (/margin|padding|width|offset/.test(p)) {
|
||||
if (/margin|padding|width|inset|offset/.test(p)) {
|
||||
valueType = "length";
|
||||
} else if (/color/.test(p)) {
|
||||
valueType = "color";
|
||||
|
|
@ -110,7 +110,7 @@ function init() {
|
|||
blockEnd: p.replace("-inline-end", "-block-end"),
|
||||
type: valueType
|
||||
};
|
||||
if (/^offset/.test(p)) {
|
||||
if (/^(offset|inset)/.test(p)) {
|
||||
group.left = "left";
|
||||
group.right = "right";
|
||||
group.top = "top";
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue