[css3-layout] §3.4 - Forms Example

In §3.4[1], the second example shows laying out a simple form using
the new slots layout. In this example, each form element has a
specific slot assigned to it.

Does the slots system allow for any kind of implicit repetition of
slots for repeating elements? This needs an example, so I shall try to
describe it as best I can:

Staying with forms, lets say we have 5<input type="text"> input
fields, each with a preceding label. "n" is used to represent a unique
ID:

<form id="example" action="/">
  <label for="n">Input n</label>  <input id="n" type="text">
  <label for="n">Input n</label>  <input id="n" type="text">
  <label for="n">Input n</label>  <input id="n" type="text">
  <label for="n">Input n</label>  <input id="n" type="text">
  <label for="n">Input n</label>  <input id="n" type="text">
  <input type="submit">
</form>

And here's the starting point CSS for handling the layout:

form { display: "ab"
                     "cc"; }

form input[type="submit"] { position: c; }

Now, if I were to position all labels into "a" and all inputs into
"b", my understanding is that they will stack vertically independently
from each other. So what I really want is for the entire row "ab" to
"repeat" for each label/input pair, so that as well as defining their
horizontal postion using the slots, they remain vertically aligned
with each other (regardless of the height of the preceeding
label/input slot.

As best I can see, I would need to declare unique slot names for each
individual form element. If this is the case, I think it's a problem
since it would make alterations to the form (insertion of new fields,
for example) dependent on editing the CSS.

[1] http://www.w3.org/TR/2005/WD-css3-layout-20051215/#position

I apologies for my somewhat awful expression, but I hope I've got the
point across.

Kind regards,
Ben

Received on Friday, 16 December 2005 23:48:17 UTC