Buenas tardes, Martin: Pues encuentro muy interesante la crítica del funcionario del Spri. Creo que está bien sustentada y me ha convencido, así es que he modificado mi ejemplo:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";> <html xmlns="http://www.w3.org/1999/xhtml"; xml:lang="es" lang="es"> <head> <title>Columnas sin tablas</title> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-15" /> <style type="text/css"> label { background-color: yellow; display: block; margin-top: 4px; /* separación entre filas */ } select, input { position: absolute; left: 25%; /* ancho de la primera columna */ width: 74%; /* ancho de la segunda columna */ } </style> </head> <body> <h1>Columnas sin tablas</h1> <label>nombre<input id="nombre"/></label> <label>apellidos<input id="apellidos"/></label> <label>edad<input id="edad" size="2"/></label> <label>profesión<input id="profesion" size="30"/></label> <label>estado civil<select id="estado"><option>soltero</option><option>casado</option><option>divorciado</option><option>viudo</option></select></label> </body> </html> Lo he probado con IE7, FF3.6 y Chrome 0.3, y en todos funciona bien. El diseño sigue siendo "líquido", porque si redimensionas la ventana, el contenido también se redimensiona proporcionalmente. Saludos, y gracias por el "feedback". Santiago. > Message: 2 > Date: Mon, 12 Apr 2010 11:16:39 +0200 > From: Martin Etxauri <[email protected]> > Subject: Re: [Ovillo] [OT] consulta sobre utilización de > tablas en > forms > To: "Ovillo, la lista de CSS en castellano" <[email protected]> > Message-ID: <[email protected]> > Content-Type: text/plain; charset=windows-1252 > > Hola a todos > > Respecto a este tema de los formularios os envío lo que > nos comentaba el funcionario que hizo la revisión de la web > (en este caso del spri, organismo del gobierno vasco que se > ocupa de estas cosas). Según esto lo que tu mandas, > Santiago, no sería correcto, luego podéis estar de acuerdo > o no :) pero yo os lo pongo: > > aquí va: > ------- > ? Los formularios de la web carecen de elementos > estructurales. Si no se desea utilizar elementos > estructurales en el formulario, la asociación implícita de > los controles y las etiquetas del formulario deberá > realizarse por englobamiento y no por posicionamiento. > > A lo que nos referimos es que los campos de formulario no > tienen ninguna estructura (<p> o incluso <li>). > Debido a que son campos de formulario, no hace falta > utilizar esos elementos estructurales, porque podemos > utilizar el elemento <label> para dar la estructrura. > Pero en este caso la asociación debe ser por englobamiento > y no por posicionamiento (como ocurre ahora): > > Es decir, si no se quiere utilizar otra estructura > (<p>), se podrá utilizar el elemento <label>, > que ofrece suficiente estructura si cada label engloba tanto > la etiqueta de texto como campo de formulario: > > * incorrecto: <label> texto </label> + campo > formulario > * correcto: <p><label> texto</label> + > campo formulario </p> > * correcto: <label> texto + campo formulario > </label> > * correcto: <p><label> texto + campo formulario > </label></p> > > Es decir, la estructura mínima se tiene que ofrecer > mediante los <label>, englobando [1]. Sí sólo hay > <label>, pero éste no engloba texto y campo, sino que > están uno después del otro [2], entonces no es correcto y > hay que buscar una estructura más, como el <p>. > > [1] Englobamiento: cuando <label> engloba tanto a > etiqueta de texto como a campo de formulario. > [2] Posicionamiento: el <label> sólo engloba la > etiqueta de texto e inmediatamente después, se pone el > campo de formulario. > > -------- _______________________________________________ Lista de distribución Ovillo Para escribir a la lista, envia un correo a [email protected] Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://lists.ovillo.org/mailman/listinfo/ovillo
