Chovy’s Blog

Ruby Text in CSS3

Wed, September 12, 2007 — Category: UI Design

No…not that “ruby” (aka ruby on rails). “Ruby text”, as it pertains to CSS3, allows for aligning fragments of text without a complex table structure to achieve the same thing.

“Ruby text” is a new paradigm added to the CSS 3 specification (currently in draft). It allows an author to associate and align blocks or fragments of text with each other.

“Ruby” is the term used for a run of text that is associated with another run of text, referred to as the base text. Ruby text is used to provide a short annotation of the associated base text.CSS 3.0


<ruby>
  <rb>WWW</rb>
  <rt>World Wide Web</rt>
</ruby>

This would allow the design to place the ruby and the ruby text in the desired order, as shown here:

Ruby text markup

Common use cases will be for content written in Japanese or Chinese…although there are many examples of it in English as well.

  • Post Ruby Text in CSS3 to del.icio.us
  • Post Ruby Text in CSS3 to digg
  • Post Ruby Text in CSS3 to Furl
  • Add Ruby Text in CSS3 to YahooMyWeb
  • Simpify!
  • Post Ruby Text in CSS3 to shadows
  • Post Ruby Text in CSS3 to Spurl
  • Post Ruby Text in CSS3 to BuddyMarks
  • Submit Ruby Text in CSS3 to Slashdot

1 Comment »

Comment by Tata Consulting Services

December 14, 2007 @ 4:04 pm

Sweet article.
I hope you’ll surf on our page..
Thank you again

RSS feed for comments on this post. TrackBack URI

Leave a comment

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <code> <em> <i> <strike> <strong>

 
Keyword Advertisers:
SEO Directory SEO Links Free Link Directory Shopping Submission Directory Gardening Tips Political Forum Search Engine Optimization Search Engine Marketing Audio Video Directory SEO Forum Web Development Blog Organic SEO Wiki Web Development Consulting

Learn more about purchasing keyword text link ads on this site.