wpt / css / css-text / text-autospace / text-autospace-combining-marks.html

Status: PASS | Duration: 21ms | Subtests: 1/1 | Open test on wpt.live | Open ref on wpt.live | wpt.fyi

/css/css-text/text-autospace/text-autospace-combining-marks.html

<!DOCTYPE html>
<meta charset="utf-8">
<link rel="help" href="https://drafts.csswg.org/css-text-4/#text-autospace-property">
<link rel="author" title="Vitor Roriz" href="https://github.com/vitorroriz">
<link rel="match" href="text-autospace-combining-marks-ref.html">
<style>
.test {
  font-size: 40px;
  border: solid 3px salmon;
  width: fit-content;
  margin-bottom: 2px;
}
.normal {
  text-autospace: normal;
}
</style>
<div class="test normal">国&#x301;X</div>
<div class="test normal">国&#x301;国</div>
<div class="test normal">国&#x301;X&#x301;</div>
<div class="test normal">国&#x301;&#x301;</div>
<br>
<div class="test normal">X&#x301;X</div>
<div class="test normal">X&#x301;国</div>
<div class="test normal">X&#x301;X&#x301;</div>
<div class="test normal">X&#x301;&#x301;</div>
<br>
<div class="test normal">XX</div>
<div class="test normal">X国</div>
<div class="test normal">XX&#x301;</div>
<div class="test normal">X国&#x301;</div>
<br>
<div class="test normal">国X</div>
<div class="test normal">国国</div>
<div class="test normal">国X&#x301;</div>
<div class="test normal">国国&#x301;</div>

/css/css-text/text-autospace/text-autospace-combining-marks-ref.html

<!DOCTYPE html>
<meta charset="utf-8">
<link rel="help" href="https://drafts.csswg.org/css-text-4/#text-autospace-property">
<link rel="author" title="Vitor Roriz" href="https://github.com/vitorroriz">
<style>
.test {
  font-size: 40px;
  border: solid 3px salmon;
  width: fit-content;
  margin-bottom: 2px;
  text-autospace: no-autospace;
}
.manual-spacing {
  margin-right: 0.125em;
}
</style>
<div class="test"><span class="manual-spacing">国&#x301;</span>X</div>
<div class="test"><span>国&#x301;</span>国</div>
<div class="test"><span class="manual-spacing">国&#x301;</span>X&#x301;</div>
<div class="test"><span>国&#x301;</span>国&#x301;</div>
<br>
<div class="test"><span>X&#x301;</span>X</div>
<div class="test"><span class="manual-spacing">X&#x301;</span>国</div>
<div class="test"><span>X&#x301;</span>X&#x301;</div>
<div class="test"><span class="manual-spacing">X&#x301;</span>国&#x301;</div>
<br>
<div class="test"><span>X</span>X</div>
<div class="test"><span class="manual-spacing">X</span>国</div>
<div class="test"><span>X</span>X&#x301;</div>
<div class="test"><span class="manual-spacing">X</span>国&#x301;</div>
<br>
<div class="test"><span class="manual-spacing">国</span>X</div>
<div class="test"><span>国</span>国</div>
<div class="test"><span class="manual-spacing">国</span>X&#x301;</div>
<div class="test"><span>国</span>国&#x301;</div>