Que estoy haciendo mal????

Snake nS · #1 (**permalink**) 28/05/2006, 14:27

Código:

<!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">

	<head>
		<meta http-equiv="content-type" content="text/html;charset=utf-8"/>
		<title>Untitled Page</title>
		<link href="template/estilo1.css" rel="stylesheet" type="text/css"/>
	</head>

	<body>
	
	<div style="border:2px solid red; height:auto">
	
	<div style="border:1px solid black">Borde Superirior</div>
	<div style="border:1px solid black">Menu Superior</div>
	
	<div id="centro">
			
			<div class="contienemenu">
					
				<table width="100%" border="1">
  					<tr>
    					<td><p>Menu</p>
   					  </td>
  					</tr>
		    	</table>
				
			</div>
			
			<div class="cuadriculaderecha">
		
			<!--Tabla contiene-->
			<table width="100%" border="1">
  				<tr>
   					 <td>

				<!--Tabla izquierda-->
				<table width="70%" border="1" style="float:left">
  					<tr>
    					<td>d</td>
    					<td>d</td>
    					<td>d</td>
  					</tr>
				</table>
				<!--FIN Tabla izquierda-->
				<!--Tabla derecha-->
				<table width="30%" border="1" style="float:right">
  					<tr>
    					<td>AAAA</td>
  					</tr>
				</table>
			    <!--FIN Tabla derecha-->
					</td>
 			 	</tr>
			<!--FIN Tabla contiene-->
			</table>
			
		
			</div>
			
		</div>

	</div>
	
	</body>

</html>

Código:

body { color: black; background-color: white; }

#centro { width: 100%; height:auto}
.contienemenu { width:11%; float:left; height:auto}
.cuadriculaderecha { float:right; width:89%; height:auto}

Si se fijan en firefox, se visualisa mal, ya que la capa que contiene al sitio no contiene todo el mismo.

Saludos y gracias.

g05l21 · #2 (**permalink**) 28/05/2006, 16:27

A ver, el problema es que las clases que has creado llevan float. Y eso crea efectos "curiosos" (por decirlo de alguna forma) con el flujo normal.

Si por ejemplo escribes algo al final de las tablas verás como entonces si lo recubre y eso se debe a que para los navegadores que cumplen los estandar (tb debería pasar en Opera, en Amaya y en Safari) los divs con float son tratados de forma distinta dentro del flujo. Por ejemplo si pones un div sin float verás que se situa conforme a los otros divs sin float, obviando donde se situe este.

Para evitar este problema, podías ampliar el css del centro con un heigth fijo o quitar los float a las clases e intentar ponerlo de otra forma.

Perdona si no ha quedado muy claro, pero es que no es fácil de explicarlo, sobretodo si no lo tienes tu muy claro ;)

Snake nS · #3 (**permalink**) 28/05/2006, 16:41

Si me quedo claro, el problema es que nececito que un elemento este situado al lado del otro, porque no puedo mesclar el menu y los contenidos en una misma cosa, y si lo hago con tablas obtengo problemas tambien.

g05l21 · #4 (**permalink**) 29/05/2006, 02:54

Lo más fácil es que te pases por esta dirección y veas ejemplos, a ver si alguno te va bien para lo que quieres.

http: // blog.html.it / layoutgala / (Quita los espacios del enlace. Q todavía no tengo los suficientes mensajes como para poner urls ; )