Re: IUI creating multiple small buttons in row?

My pleasure :)


On 5 avr. 2012, at 12:07 AM, sblair <[EMAIL PROTECTED]> 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 <[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.
> 

-- 
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.