Note that this is a custom need, so you have to code some custom CSS for it.
See this example here: http://jsfiddle.net/BRNBn/ <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> Using this CSS ul.inlinebuttons li { display: inline-block; } ul.inlinebuttons li a { position: relative; height: auto; padding: 0.7em 0.5em; top: auto; right: auto; } See? 10 lines of CSS :) Also, default theme buttons comes with the blue of the toolbar as a background (since it's normally to use only there). For a clearer look, you'd better use the gradient-based theme In the header, just replace iui/t/default/default-theme.css by iui/t/defaultgrad/defaultgrad-theme.css Which results to http://jsfiddle.net/xTUaS/1/ Remi On Wed, Apr 4, 2012 at 12:03 AM, sblair <[email protected]> wrote: > So I tried dropping this in the ul/li format with the CSS and I still > end up with it just drawing the buttons on top of each other it > appears. I only see the ++ button being visible. > > What I'm trying to achieve is: > > Row Label > [--] [ - ] [ + ] [++] > > Where the buttons are side by side on the same row. Any help is > greatly appreciated! > > Thanks > Scott > > On Apr 3, 11:27 am, Remi Grumeau <[email protected]> wrote: > > Using a ul/li combinaison? > > > > <div class="row"> > > <ul class="inlinebuttons"> > > <li><a id="backButton" class="button" href="#"></a></li> > > <li><a class="button blueButton" href="#">--</a></li> > > <li><a class="button blueButton" href="#">-</a></li> > > <li><a class="button blueButton" href="#">+</a></li> > > <li><a class="button blueButton" href="#">++</a></li> > > </ul> > > </div> > > > > then with some CSS > > ul.inlinebuttons { > > width: 100%;} > > > > ul.inlinebuttons li { > > display: inline; > > > > } > > > > But where do you want those buttons to be? In the page or in the > toolbar? i > > see backButton... you know you can only have one element with the same > ID ? > > > > Remi > > > > > > > > On Tue, Apr 3, 2012 at 8:11 PM, sblair <[email protected]> wrote: > > > I'm trying to figure out how to create multiple small buttons within a > > > single row all side by side. > > > > > Basicallly I'm looking to have 4 buttons ( --, -, +, ++ ) in a > > > single row in IUI. > > > > > I've tried doing this as these buttons are the perfect size, but it > > > just ignored the row I was putting them at and put them in the first > > > row at the top with them all piled on top of each other and not > > > positioned next to each other. > > > > > <div class="row> > > > <a id="backButton" class="button" href="#"></a> > > > <a class="button blueButton" href="#">--</a> > > > <a id="backButton" class="button" href="#"></a> > > > <a class="button blueButton" href="#">-</a> > > > <a id="backButton" class="button" href="#"></a> > > > <a class="button blueButton" href="#">+</a> > > > <a id="backButton" class="button" href="#"></a> > > > <a class="button blueButton" href="#">++</a> > > > </div> > > > > > Suggestions? > > > > > Thanks. > > > Scott > > > > > -- > > > You received this message because you are subscribed to the Google > Groups > > > "iPhoneWebDev" group. > > > To post to this group, send email to [email protected]. > > > To unsubscribe from this group, send email to > > > [email protected]. > > > For more options, visit this group at > > >http://groups.google.com/group/iphonewebdev?hl=en. > > -- > You received this message because you are subscribed to the Google Groups > "iPhoneWebDev" group. > To post to this group, send email to [email protected]. > To unsubscribe from this group, send email to > [email protected]. > For more options, visit this group at > http://groups.google.com/group/iphonewebdev?hl=en. > > -- You received this message because you are subscribed to the Google Groups "iPhoneWebDev" group. To post to this group, send email to [email protected]. To unsubscribe from this group, send email to [email protected]. For more options, visit this group at http://groups.google.com/group/iphonewebdev?hl=en.
