[SOLUCIONADO] div con imagenes

fdma_7 · #1 (**permalink**) 09/05/2013, 11:49

Hola a todos, primero decir que llevo poco tiempo en el mundo de la web, queria deciros una duda a ver si me la solucionais:

Quiero crear una pagina de inicio con <divs> y dentro de estos <a> y <img>, imaginaos una tabla de 8 columnas x 6 filas, justamente el las filas de enmedio quiero poner una imagen que ocupe 2 filas y 2 columnas, como puedo hacerlo??
(lo quiero hacer sin tabla y sin tds)

Muchas gracias

ArturoGallegos · #2 (**permalink**) 09/05/2013, 11:58

haz que la celda ocupe esos espacios y mete la imagen dentro de esta
<td rowspan="2" colspan="2"><img /></td>

por cierto no existe ninguna etiqueta <divs> debe ser <div>

fdma_7 · #3 (**permalink**) 09/05/2013, 12:04

Cita:

Iniciado por ArturoGallegos

Si, con tablas funcionaria, pero sin ellas?? pongo el codigo:

Código:

<html>
	<head>
		<meta charset="UTF-8">
		<title>Inicio Rapido</title>
		<style>
			*{margin: 0 auto;}
			body{background: #151515;}
			#layout{width: 808px; background: #fff; padding-top: 1px; padding-left: 1px;}
			.fila a {display: inline-block;}
			.fila img {padding-right: 1px; padding-bottom: 1px; width:100px; height:100px}
			.search {width:201px; height:201px;}
		</style>
	</head>
	<body>
		<div id='layout'>
			<div class='fila'>
				<a href=""><img src=""/></a><!--
				--><a href=""><img src=""/></a><!--
				--><a href=""><img src=""/></a><!--
				--><a href=""><img src=""/></a><!--
				--><a href=""><img src=""/></a><!--
				--><a href=""><img src=""/></a><!--
				--><a href=""><img src=""/></a><!--
				--><a href=""><img src=""/></a>
			</div>
		<div class='fila'>
				<a href=""><img src=""/></a><!--
				--><a href=""><img src=""/></a><!--
				--><a href=""><img src=""/></a><!--
				--><a href=""><img src=""/></a><!--
				--><a href=""><img src=""/></a><!--
				--><a href=""><img src=""/></a><!--
				--><a href=""><img src=""/></a><!--
				--><a href=""><img src=""/></a>
			</div>
                        <div class='fila'>
				<a href=""><img src=""/></a><!--
				--><a href=""><img src=""/></a><!--
				--><a href=""><img src=""/></a><!--
				--><a href=""><img src=""/></a><!--
				--><a href=""><img src=""/></a><!--
				--><a href=""><img src=""/></a><!--
				--><a href=""><img src=""/></a>
			</div>
		</div>
	</body>
</html>

Como veis en la ultima fila, hay un hueco menos, pues en esa fila quiero que una imagen ocupe 2 columnas

Muchas Gracias

iEnrique · #4 (**permalink**) 09/05/2013, 15:39

Ve ajustandolo con margin...

fdma_7 · #5 (**permalink**) 23/05/2013, 03:22

Ya esta solucionado, use el el display:table y dentro de este unos div para tres columnas con el display:table-cell.
Gracias por vuestros comentarios