[Html-widget] FormFu - css question

[Mario Minati]

Am Mittwoch 21 März 2007 12:23 schrieb Carl Franks:
> On 21/03/07, Mario Minati <mario.minati at googlemail.com> wrote:
> > tried/managed to create a multi element that aligns part of his content
> > right aligned?
> >
> > Goal is to create a line of buttons where the submit button is on the
> > left side and the reset and cancel buttons are on the right side.
>
> Below is an example form, consisting of 2 text fields, then a multi
> containing the 3 buttons.
> Below that there's some css you should add to the end of the
> examples/vertically-aligned.css file.
>
> Because xhtml doesn't define a cancel button, you need to just use
> another submit button, and have your app decide which was clicked
> according to which name was submitted.
> I've picked 'cancel' as the button's name - if you change it, you'll
> need to change the input[name="cancel"] part of the css accordingly.
> Also, because of the way css align:right works - to get the cancel
> button to sit on the right side of the reset button, it has to be
> before the reset button in the markup. It's just a css quirk you have
> to remember.
>
> Carl
>
> *** yaml form ***
> ---
> id: form
> auto_id: %n
> auto_fieldset: 1
> elements:
>   - type: text
>     name: text1
>     label: Text1
>   - type: text
>     name: text2
>     label: Text2
>   - type: multi
>     elements:
>       - type: submit
>         name: submit
>       - type: submit
>         name: cancel
>         value: Cancel
>       - type: reset
>     container_attrs:
>       class: buttons
>
> *** css ***
>
> fieldset {
> 	width: 24em;
> }
>
> fieldset .multi.buttons {
> 	margin-left: 1px;
> }
>
> fieldset .multi.buttons input[type="reset"],
> fieldset .multi.buttons input[name="cancel"]
> {
> 	float: right;
> }
>
Boy that was easy,
I thought I would need tons of clear: left/both/right and a multi inside a 
multi with moving the second multi by css ;-)

Thanks Carl for your help.

Greets,
Mario