in JS Fiddle here –>http://jsfiddle.net/xTUaS/1/
<!DOCTYPE html> <html lang="en"> <head> <title>Inline Buttons</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0"> <link rel="stylesheet" href="http://iui.googlecode.com/git/web-app/iui/iui.css" type="text/css" /> <link rel="stylesheet" href="http://iui.googlecode.com/git/web-app/iui/t/defaultgrad/defaultgrad-theme.css"  type="text/css"/> <script type="application/x-javascript" src="http://iui.googlecode.com/git/web-app/iui/iui.js"></script> <style> ul.inlinebuttons li { display:   inline-block; } ul.inlinebuttons li a { position:   relative; height:    auto; padding:    0.7em 0.5em; top:      auto; right:     auto; } </style> </head> <body> <div class="toolbar"> <h1 id="pageTitle">Inline Buttons</h1> <a id="backButton" class="button" href="#"></a> </div> <div id="home" title="Inline Buttons" class="panel" selected="true"> <fieldset> <div class="row"> <ul class="inlinebuttons"> <li><a href="javascript:;" class="button">--</a></li> <li><a href="javascript:;" class="button">-</a></li> <li><a href="javascript:;" class="button">+</a></li> <li><a href="javascript:;" class="button">++</a></li> </ul> </div> </fieldset> </div> </body> </html>​