Re: Grid In 1.2?

On Thu, 8 Jul 2004, Cameron McCormack wrote:
>
> A simple example of where a grid would be useful is a simple form layout
> with text labels and text entry boxes, like this:
>              _____________
>   E-mail:   |_____________|
>              _____________
>   Password: |_____________|

o_O

Wouldn't putting that kind of content in SVG be equivalent to putting it
in XSL:FO, or PDF? I would have thought that kind of markup would be much
more appropriate in a semantic markup language rather than a
presentational language.

In XHTML, it would be:

   <p>
    <label for="email"> E-mail: </label>
    <input id="email" name="email"/>
   </p>
   <p>
    <label for="password"> Password: </label>
    <input id="password" name="pw"/>
   </p>

...with the following CSS:

   p { display: table-row; }
   label, input { display: table-cell; }
   input { width: 20em; height: 1.5em; }

This has the advantage of being accessible (e.g. activating the label will
activate the input control), and, indeed, of actually having input
controls that work and can be submitted. The elements used are device-
independent, and so will work equally well in a voice browser environment
as a visual one.

This altogether seems significantly better overall than the version you
proposed, which is extremely reminiscent of the whole content-tables-
used-for-layout nonsense that I thought we were trying to get away from:

>   <grid vertical-align="middle">
>     <gridRow>
>       <gridCell>
>         <flowPara>E-mail:</flowPara>
>       </gridCell>
>       <gridCell>
>         <flowPara>
>           <flowImage>
>             <rect width="20em" height="1.5em"/>
>           </flowPara>
>         </flowLine>
>       </gridCell>
>     </gridRow>
>     <gridRow>
>       <gridCell>
>         <flowPara>E-mail:</flowPara>
>       </gridCell>
>       <gridCell>
>         <flowImage>
>           <rect width="20em" height="1.5em"/>
>         </flowPara>
>       </gridCell>
>     </gridRow>
>   </grid>

-- 
Ian Hickson               U+1047E                )\._.,--....,'``.    fL
http://ln.hixie.ch/       U+263A                /,   _.. \   _\  ;`._ ,.
Things that are impossible just take longer.   `._.-(,_..'--(,_..'`-.;.'

Received on Thursday, 8 July 2004 09:10:33 UTC