I'd like to make some of those buttons gray (or red), how do I do it?
On Wednesday, April 4, 2012 7:45:01 PM UTC-3, Remi Grumeau wrote: > > My pleasure :) > > > On 5 avr. 2012, at 12:07 AM, sblair <s.b...@ieee.org <javascript:>> wrote: > > > 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 <remi.grum...@gmail.com> 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 <s.bl...@ieee.org> 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 <remi.grum...@gmail.com> 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 <s.bl...@ieee.org> 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 > >>>>> iphone...@googlegroups.com<javascript:> > . > >>>>> To unsubscribe from this group, send email to > >>>>> iphonewebdev...@googlegroups.com <javascript:>. > >>>>> 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 > >>> iphone...@googlegroups.com<javascript:> > . > >>> To unsubscribe from this group, send email to > >>> iphonewebdev...@googlegroups.com <javascript:>. > >>> 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 iphone...@googlegroups.com<javascript:> > . > > To unsubscribe from this group, send email to > iphonewebdev...@googlegroups.com <javascript:>. > > 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 iphonewebdev@googlegroups.com. To unsubscribe from this group, send email to iphonewebdev+unsubscr...@googlegroups.com. Visit this group at http://groups.google.com/group/iphonewebdev?hl=en.
