<!DOCTYPE html>
<p>The orange, blue, yellow and green text boxes should not overlap.</p>
<style>
div, ruby {
font: 1em/1 Ahem, sans-serif;
font-size: 500%;
}
</style>
<ruby style="color:blue;">
<span style="color:orange;">1234</span> ABCD <span style="color:yellow;">4578</span>
</ruby>
<div style="color:green;">
EFGH
</div>