﻿<!DOCTYPE html>
<style>
    .b::before {
        content: '[before]';
        color: blue;
    }
    .a::after {
        content: '[after]';
    }
    span {
        color: blue;
    }
    rt {
        background: yellow;
    }
</style>
<p>Tests that CSS-generated :before or :after content just appear as
    if they were the first or last DOM child of the ruby element.</p>
<p>The blue text should have annotations above them (yellow background).</p>
</p>Foo <ruby class="b"><span>b</span><rt>long text</rt></ruby> Bar<br></p>
</p>Foo <ruby class="a"><span>b</span><rt>long text</rt></ruby> Bar<br></p>
</p>Foo <ruby class="b a"><span>b</span><rt>long text</rt></ruby> Bar<br></p>