Skip to content

Instantly share code, notes, and snippets.

@SethClydesdale
Last active July 5, 2020 17:41
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save SethClydesdale/3e9668ff2ba110e94c971a99029f3b0d to your computer and use it in GitHub Desktop.
Save SethClydesdale/3e9668ff2ba110e94c971a99029f3b0d to your computer and use it in GitHub Desktop.
Polyfill for ruby-position:under; Hackishly displays the <rt> tag underneath the <ruby> tag.
/*
* browser support: Webkit, Gecko, MS browsers [ALL OK]
* sauce: https://twitter.com/SethC1995/status/1279827154788913152 (extra info in self-replies)
*/
/* text-align, font-size, margin, bottom, line-/height may all be adjusted to fit preferences */
ruby {
text-align:center;
display:inline-block;
position:relative;
bottom:-16px;
margin:-16px 0 16px 0;
}
ruby rt {
font-size:11px;
display:block;
height:15px;
line-height:15px;
margin-top:-1px; /*optional; keeps furigana closer to origin */
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment