Comunidad de diseño web y desarrollo en internet online

CSS: Tableless + Divless layout

Citar            
MensajeEscrito el 16 Oct 2007 01:37 pm
Buscando que mis HTML sean lo más permisivas posibles en cuanto a diseño con CSS, estoy empezando a buscar maneras de maquetar mis páginas sin usar divs. Con esto gano en semántica de mi HTML y en teoría también debería ganar en flexibilidad del diseño, pero esto último me está dando algunos quebraderos de cabeza. Por ejemplo, para crear columnas, no se me ocurre nada mejor que los div.

Se os ocurre alguna manera de, sin cambiar el código siguiente, disponer los elementos de la manera especificada en el diagrama? (Teniendo en cuenta que todos los elementos tienen un contenido variable, y, por tanto, alto indefinido, y que el ancho del bloque 3 es también indefinido):

Código :

<body>
  <p id="bloque1">Bloque1</p>
  <p id="bloque2">Bloque2</p>
  <p id="bloque3">Bloque3</p>
  <p id="bloque4">Bloque4</p>
</body>




Gracias por vuestro tiempo y un saludo.

Por akhasis

75 de clabLevel



 

firefox
Citar            
MensajeEscrito el 16 Oct 2007 01:41 pm

Por akhasis

75 de clabLevel



 

firefox
Citar            
MensajeEscrito el 22 Oct 2007 08:33 pm
Usar un div de ninguna manera es perder en semántica. La etiqueta <div> significa división , y sirve para eso, dividir las distintas secciones de tu pagina: Encabezados, menu, footer, cuerpo etc. Una etiqueta p, por el contrario, sirve para demarcar apenas un parrafo, en el cual normalmente se encuentra texto.

Saludos

Por Lunatic Lycanthrop

Claber

1203 de clabLevel

7 tutoriales

1 ejemplo

Genero:Masculino  

The dark places where wolves access internet with 46,6 kbps

firefox
Citar            
MensajeEscrito el 25 Oct 2007 10:30 am
Llevas razón en lo de los p, aunque lo puse así por simplificar, en mi layout pueden ser cualquier otro elemento.

Los divs, según como los utilices, sí que pueden hacer perder en semántica. La mayoría de layouts basados en divs anidan div una y otra y otra vez, enrevesando el código y haciendo que no sea tan diferente de maquetar con tablas.

Un caso en el que un div se orienta más al diseño que al contenido es en el que lo usamos para crear una columna, por ejemplo. Además de que "idealmente" nos está haciendo perder flexibilidad de diseño con css, ¿qué pasa si queremos modificar el diseño y poner uno de los elementos que están dentro de la columna en otra parte del layout?

En realidad este post era más una reflexión que un caso práctico (aunque sí que se derivaba de uno), sería estupendo poder crear columnas y otras estructuras fluidas sin depender de los divs.

Un saludo.

Por akhasis

75 de clabLevel



 

firefox
Citar            
MensajeEscrito el 25 Oct 2007 05:55 pm
Creo que esos "problemas" se solucionarán con CSS3. Lo de poner div's para el diseño acabará con cosas como los multi background. Aunque para eso faltan años. Primero para que salga CSS3 y segunda para cuando Internet Explorer implemente bien el CSS3.

Por ryuz

350 de clabLevel

2 tutoriales

 

firefox

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.