layout/reftests/font-features/1376231-vertical-gpos-adjustments-ref.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4 <meta charset=utf-8>
   5 <style>
   6 @font-face {
   7   font-family: test;
   8   src: url(../fonts/NotoSansCJKjp-Regular.subset.otf);
   9 }
  10 body {
  11   font-family: test, serif;
  12   line-height: 2em;
  13 }
  14 p {
  15   margin: 1em;
  16 }
  17 span {
  18   display: inline-block;
  19   inline-size: 9em; /* length of 9 standard CJK chars */
  20 }
  21 .v {
  22   writing-mode: vertical-rl;
  23 }
  24 .green {
  25   color: green;
  26   background: green;
  27 }
  28 .overlay {
  29   position: relative;
  30   inset-block-start: -3em;
  31 }
  32 </style>
  33 </head>
  34 <body>
  35 There should be no red:
  36 <div>
  37   <p><span>&nbsp;</p>
  38   <p class="overlay"><span class="green">&nbsp;</p>
  39   <p><span>&nbsp;</p>
  40   <p class="overlay"><span class="green">&nbsp;</p>
  41 </div>
  42 <div class="v">
  43   <p><span>&nbsp;</p>
  44   <p class="overlay"><span class="green">&nbsp;</p>
  45   <p><span>&nbsp;</p>
  46   <p class="overlay"><span class="green">&nbsp;</p>
  47 </div>