Un diseño más sencillo de una tabla en CSS.

[PabloManuel]

Bueno, pues ya me lie la manta a la cabeza y he empezado a usar CSS en vez de tablas.

Tengo que comenzar la realización de una nueva Web y he aprobechado el momento para pasar de tablas a CSS sin variar el diseño, es decir, una traducción, ya habrá tiempo de lucirse.

1º he leído la guía de la migración sin dolor
2º estoy leyendo/viendo los manuales de Desarrolloweb.com

Verlo es fácil, pero cuando tienes que hacerlo tú.....

Aún estoy con el index y he llegado a un punto que no avanzo.

Se trata de mostrar 5 noticias en un index en una fila una al lado de la otra con este formato:

[URL=http://imageshack.us/photo/my-images/683/sinttulo1xnc.jpg/][IMG]http://img683.imageshack.us/img683/695/sinttulo1xnc.jpg[/IMG][/URL]

Con las tablas es sencillo, una tabla dentro de otra de esta manera y a aplicar formato:

[URL=http://imageshack.us/photo/my-images/684/sinttulo1fqg.jpg/][IMG]http://img684.imageshack.us/img684/6273/sinttulo1fqg.jpg[/IMG][/URL]

Pero con CSS no lo consigo, me sale, pero con un montón de DIV, SPAN y P. Pongo uno por cada objeto, tendiendo que crear un ID o clase para cada uno.

El problema es que no quiero hacer una clase para cada pequeño diseño de la Web y creo que estoy planteando mal el diseño usando demasiadas etiquetas.

¿Alguien me puede ayudar?

[jfw]

el estilo que le apliques al div contenedor de cada noticia debe ser:

Código:

float: left;

[PabloManuel]

Sí claro, es decir, con un FOR de 1 a 5 creo los 5 DIV, todos con el float en left. El problema es la distribución de la foto y los 4 campos: título, entrada, fecha y visitas.

Código:

	<!-- Inicio: Bloque de las 5 noticias -->
	<div class="seccion_index">
		<%
	'Creamos consulta de las 5 noticias del index
    CrearRs "SELECT Top 5 * FROM noticias order by nofecha desc"

    'Evitamos que si hay entre 1 y 4 artículos, dé error la página.

    If rs.recordcount < 5 then
       RegAmostrar = rs.recordcount
    else
       RegAmostrar = 5
    End If   
              
    if Not rs.eof then
              
       For i = 1 to RegAmostrar 
          %>
          <span class="flotado_der">
	        <img class="img_noticia_index" src='FotosNO/<%=rs("nocod")%>1.jpg'> 
       	     <p class="flotado_der" ><%=Rs("Notitulo")%></p>
       	     <p class="flotado_der" ><%=Rs("Noentrada")%></p>
       	     <p class="flotado_der" ><%=Rs("Nofecha") & Rs("NoVisitas")%></p>
	  </span><%
	      Rs.MoveNext
	   Next 
  
	End If   
    %></div>
	<!-- Fin: Bloque de las 5 noticias -->

Aquí las clases:

Código:

.seccion_index {
	float: left;
	width: 840px;
	margin: 5px 0px 5px 0px;
}
.img_noticia_index{
	float: left ; 
	padding: 2px;
	width: 100px;
}
.flotado_der{
	float: left ;
	width: 280px;
}

Qué es lo que no me gusta, pues tener que hacer una clase para cada trocito de la Web, creo que no lo estoy haciendo bien.