The Baseline plugin automatically adjusts the bottom margin of select elements to conform to a vertical rhythm. If the browser window is resized, all margins will be dynamically recalculated to maintain the rhythm.


The plugin works automatically in the background, so unless you wish to add or remove items on the default list of elements that are proccessed by the Baseline plugin, you don't have to make any changes. The default list of selectors can be modified in vmui.js and they are as follows:

  • Images - img, svg, canvas
  • Media objects - object, video, audio
  • Iframes - iframe
  • Charts - [class*=Chart]

Note In most cases, adding the baseline margin to variable height elements is the desired behavior. However, you may exclude an element from being processed by the Baseline plugin by adding the class skipBaseline. This is especially useful for inline elements.


You can see demos of this plugin on the Examples page.

Want to continue the tour?

VM UI Framework is created, owned, maintained by Virtuosi Media, Inc. © 2012-2013.