<!DOCTYPE html>
<html>
<head>
<style>
ruby { border: solid 5px cyan; }
.vert { -webkit-writing-mode: vertical-rl; }
</style>
</head>
<body>
Ruby text should be at the center of ruby base.
<div class="vert">
<ruby>aaaaa<rt>b</rt></ruby><br>
</div>
<hr>
<div class="vert">
<ruby>a<rt>bbbb</rt></ruby><br>
</div>
<hr>
<div>
<ruby>aaaaa<rt>b</rt></ruby><br>
</div>
<hr>
<div>
<ruby>a<rt>bbbb</rt></ruby><br>
</div>
</body>
</html>