Ver Mensaje Individual
  #5 (permalink)  
Antiguo 22/02/2011, 18:37
Avatar de kiM-
kiM-
 
Fecha de Ingreso: mayo-2008
Mensajes: 191
Antigüedad: 15 años, 10 meses
Puntos: 2
Respuesta: Quebraderos de cabea con DIVs y CSS

Bueno.. no tengo mucho ahora mismo, pero he empezado algo hace nada, todo en Dreamweaver, solo son 3 o 4 divs con una o dos imágenes.

AVISO, jamás incluyo el CSS en el mismo código, esta vez he hecho una excepción, pero no suelo hacerlo.

Código:
Cita:
<!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>Documento sin título</title>
<style type="text/css">
#body {
width: 960px;
}
#body #news #news2 {
width: 744px;
float: left;
}
#menuleft {
float: left;
width: 216px;
}
.noticias {
width: 744px;
background-image: url(webs/bgbody.png);
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 12px;
}
</style>
</head>

<body>
<div id="body"><img src="webs/logo.png" width="960" height="245" alt="Logo" /><img src="webs/menu20.png" width="960" height="106" />Colocar aquí el contenido para id "body"
<div id="news">
<div id="news2">Colocar aquí el contenido para id "news2"<img src="webs/body1.png" width="744" height="42" />
<div class="noticias">Colocar aquí el contenido para class "noticias"<img src="webs/ftbody.png" width="744" height="53" /></div>
</div>
</div>
<div id="menuleft">Colocar aquí el contenido para id &quot;menuleft&quot;</div>
</div>
</body>
</html>
Os iré diciendo, ningún error, salvo algo que quería hacer y no pude; El texto "Colocar aquí el contenido para class "noticias"" (lo máximo que conseguí fue alinearlo la primera línea, las demás, no) quería colocarlo 15 píxeles hacia la derecha sin que la misma imagen de dentro que está en el mismo div se alinee esos 15px, solo el texto, pero nada... Tampoco puedo colocar la imagen fuera de ese div porque los contenedores que estan flotando en izq-der se quitarían.

Los errores que normalmente me empezarían a ocurrir serían los siguientes:

1. Los divs que están alineados uno en la izquierda y otro en la derecha acabarían por desestructurarse (colocándose uno de los divs debajo del otro respectivamente).

2. Cuando quisiese colocar un fondo en 'X' div se me vería blanco, en uno o ambos navegadores.

3. Habría saltos de línea y eso haría que las imágenes se separasen.

4. A veces el texto se me desnivela y se coloca en una posición que yo no he ordenado.

5. El div contenedor se queda del tamaño predeterminado y los otros se saldrían fuera de él (esto lo resuelvo solo a veces).

Etc... Todos esos errores me acabarían ocurriendo sí o sí.

Saludos y gracias!