Foros del Web » Creando para Internet » CSS »

porque no me deja poner el cuadro de color flotandolo?

Estas en el tema de porque no me deja poner el cuadro de color flotandolo? en el foro de CSS en Foros del Web. que estoy haciendo mal? no veo el cuadro que he creado magenta de 300 px por 300 px. Lo he flotado a la izquierda tambien ...
  #1 (permalink)  
Antiguo 23/07/2011, 09:14
Avatar de 00israel  
Fecha de Ingreso: enero-2002
Ubicación: madrid
Mensajes: 636
Antigüedad: 15 años, 1 mes
Puntos: 5
porque no me deja poner el cuadro de color flotandolo?

que estoy haciendo mal? no veo el cuadro que he creado magenta de 300 px por 300 px. Lo he flotado a la izquierda tambien pero no lo veo. Que hago mal?

Código HTML:
<!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>prueba patri</title>
<style type="text/css">
<!--
body {
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	background-color: #f6f6f6;
}
-->
</style>
<link href="css/layout.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div id="contenedor">
  <div id="columna-logo"></div>
  <div id="texto-versioningles">bla bla bla bla bla bla</div>
</div>
<hr /> 
<div id="contenedor2">
  <div id="columnablanca2"></div>
  <div id="contenido fotos">lkjllkjlkjlkjlkjlkjl</div>
</div>
</body>
</html> 
css:
Código:
* {
	margin: 0px;
	padding: 0px;
}
#contenedor {
	width: 944px;
}
#contenedor2 {
}
#contenedor #columna-logo {
	background-color: #FFF;
	background-image: url(../links/logo.png);
	background-repeat: no-repeat;
	background-position: bottom;
	display: inline;
	float: left;
	height: 300px;
	width: 236px;
	margin-left: 41px;
	border-right-width: thin;
	border-left-width: thin;
	border-right-style: solid;
	border-left-style: solid;
	border-right-color: #CCC;
	border-left-color: #CCC;
}
#contenedor2 #contenido fotos {
	float: left;
	height: 300px;
	width: 300px;
	margin-top: 17px;
	margin-left: 17px;
	background-color: #909;
}
#contenedor #texto-versioningles {
	font-family: "Times New Roman", Times, serif;
	font-size: 12px;
	vertical-align: text-bottom;
	display: inline;
	width: 500px;
	margin-left: 17px;
	float: left;
	height: 20px;
	margin-top: 275px;
}
hr {
	background-color: #CCC;
	height: 1px;
	width: 100%;
	margin: 0px;
	padding: 0px;
	clear: both;
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
}
#contenedor2 #columnablanca2 {
	background-color: #FFF;
	display: inline;
	float: left;
	height: 600px;
	width: 236px;
	margin-left: 41px;
	border-right-width: thin;
	border-left-width: thin;
	border-right-style: solid;
	border-left-style: solid;
	border-right-color: #CCC;
	border-left-color: #CCC;
}
  #2 (permalink)  
Antiguo 23/07/2011, 09:49
Avatar de emprear
Colaborador
 
Fecha de Ingreso: junio-2007
Ubicación: me mudé
Mensajes: 8.388
Antigüedad: 9 años, 8 meses
Puntos: 1567
Respuesta: porque no me deja poner el cuadro de color flotandolo?

00israel

los identificadores ID no pueden contener espacios en blanco en su nombre

reemplazá

#contenido fotos


x

#contenido_fotos

Saludos
__________________
La voz de las antenas va, sustituyendo a Dios.
Cuando finalice la mutación, nueva edad media habrá
S.R.
  #3 (permalink)  
Antiguo 23/07/2011, 10:38
Avatar de 00israel  
Fecha de Ingreso: enero-2002
Ubicación: madrid
Mensajes: 636
Antigüedad: 15 años, 1 mes
Puntos: 5
Respuesta: porque no me deja poner el cuadro de color flotandolo?

joder, estoy atontado. Perdona y muchas gracias. Vaya despiste

ahora que acabo de arreglarlo, me hace otro extraño que no entiendo. Si yo le pongo al contenedor2 un ancho fijo de 944 px y al contenido-fotos le pongo lo que resta, 650 px, al aplicarlo no me lo pone todo en la misma fila, como si se pasase de ancho y me lo pasará para abajo, pero no lo entiendo. Porque he sumando, 41 px del espacio que tiene la columna blanca a la izquierda, 236 de la columna blanca y 17 del espacio que dejo entre el cuadro morado y la columna blanca. En total son 294 menos los 944 del ancho total son 650 que es lo que debo de ponerle al contenido-fotos. ¿porque se desborda?
  #4 (permalink)  
Antiguo 23/07/2011, 11:22
Avatar de emprear
Colaborador
 
Fecha de Ingreso: junio-2007
Ubicación: me mudé
Mensajes: 8.388
Antigüedad: 9 años, 8 meses
Puntos: 1567
Respuesta: porque no me deja poner el cuadro de color flotandolo?

00israel:

650 (ancho) + 17 (margen) + 236 (ancho) + 41 (margen) + borde (minimo 2px) = 946px

Código CSS:
Ver original
  1. border-right-width: thin;
  2.     border-left-width: thin;


Y el borde?

saludos
__________________
La voz de las antenas va, sustituyendo a Dios.
Cuando finalice la mutación, nueva edad media habrá
S.R.
  #5 (permalink)  
Antiguo 24/07/2011, 03:44
Avatar de 00israel  
Fecha de Ingreso: enero-2002
Ubicación: madrid
Mensajes: 636
Antigüedad: 15 años, 1 mes
Puntos: 5
Respuesta: porque no me deja poner el cuadro de color flotandolo?

emprear muchas gracias. no había tenido en cuenta los bordes.

otra cosita. Normalmente suelo dar un tamaño al div contenedor donde van alojados otros div. Pero ¿es necesario? porque veo que una vez que le das dimensiones a los div que van a ir dentro no le veo mucho sentido darle tambien un tamaño al div contenedor.

Y lo último. Suelo maquetar combinando posiciones relativas/absolutas con div flotados. Según necesite. ¿Hago bien? o es preferible maquetar todo flotandolo o posicionando?

gracias nuevamente.
  #6 (permalink)  
Antiguo 24/07/2011, 04:05
Avatar de Batan  
Fecha de Ingreso: septiembre-2010
Ubicación: Madrid
Mensajes: 408
Antigüedad: 6 años, 6 meses
Puntos: 63
Respuesta: porque no me deja poner el cuadro de color flotandolo?

Buenas 00israel.

Cita:
Iniciado por 00israel Ver Mensaje
otra cosita. Normalmente suelo dar un tamaño al div contenedor donde van alojados otros div. Pero ¿es necesario? porque veo que una vez que le das dimensiones a los div que van a ir dentro no le veo mucho sentido darle tambien un tamaño al div contenedor.
A un div contenedor puedes asignarle el valor auto a su propiedad height; asi tu DIV contenedor se ajustará automaticamente al height de los DIV que estan dentro.

height: auto;


Cita:
Iniciado por 00israel Ver Mensaje
Y lo último. Suelo maquetar combinando posiciones relativas/absolutas con div flotados. Según necesite. ¿Hago bien? o es preferible maquetar todo flotandolo o posicionando?
Los position pueden darte problemas de compatibilidad con los navegadores pero puedes fijarlos en cualquier posicion que te guste.

Con los float no tendras problemas de compatibilidad pero solo puedes fijarlos a la izquiera, derecha o a ninguno dentro de su contenedor.

En tal caso depende de la situación. Pero yo te recomendaria usar float.

Saludos
  #7 (permalink)  
Antiguo 24/07/2011, 05:13
Avatar de 00israel  
Fecha de Ingreso: enero-2002
Ubicación: madrid
Mensajes: 636
Antigüedad: 15 años, 1 mes
Puntos: 5
Respuesta: porque no me deja poner el cuadro de color flotandolo?

Gracias de nuevo. Lo del auto, para el height, perfecto ¿Puedo hacer lo mismo para el ancho? O sencillamente no poner ancho ya que lo van a determinar los div que van dentro no?
  #8 (permalink)  
Antiguo 24/07/2011, 05:59
Avatar de Batan  
Fecha de Ingreso: septiembre-2010
Ubicación: Madrid
Mensajes: 408
Antigüedad: 6 años, 6 meses
Puntos: 63
Respuesta: porque no me deja poner el cuadro de color flotandolo?

claro, es igual. Simplemente no pongas width si quieres quieres que coja el ancho de tu DIV.
  #9 (permalink)  
Antiguo 24/07/2011, 08:24
Avatar de emprear
Colaborador
 
Fecha de Ingreso: junio-2007
Ubicación: me mudé
Mensajes: 8.388
Antigüedad: 9 años, 8 meses
Puntos: 1567
Respuesta: porque no me deja poner el cuadro de color flotandolo?

No es exactamente lo mismo, y en particular para el ancho, por ejemplo el centrado con margin: 0px auto; no te va a funcionar si no proporcionas una medida no relativa
Otra, divs con ancho en % que esten dentro de un div sin una medidad definida, no se adpatan por carecer de un valor de referencia.

Sin conocer exactamente el conjunto de la estructura, aplicar auto al ancho puede ser necesario o no.

Saludos
__________________
La voz de las antenas va, sustituyendo a Dios.
Cuando finalice la mutación, nueva edad media habrá
S.R.
  #10 (permalink)  
Antiguo 24/07/2011, 09:52
Avatar de Batan  
Fecha de Ingreso: septiembre-2010
Ubicación: Madrid
Mensajes: 408
Antigüedad: 6 años, 6 meses
Puntos: 63
Respuesta: porque no me deja poner el cuadro de color flotandolo?

Pues gracias por la corrección.

Etiquetas: color, contenido, cuadro, fondo
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 17:56.