Remi, That was AWESOME! Thanks so much. I'm a C language guy, so javascript and especially CSS are still completely foreign to me. That worked beautifully.
Thanks! Scott On Apr 4, 1:15 am, Remi Grumeau <[email protected]> wrote: > 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 tohttp://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.
