Foros del Web » Creando para Internet » CSS »

Ajustar DIV cabecera

Estas en el tema de Ajustar DIV cabecera en el foro de CSS en Foros del Web. Muy buenas a todos :) Bueno tengo un pequeño problema, me he metido de lleno a maquetar webs con divs y dejar de lado las ...
  #1 (permalink)  
Antiguo 11/11/2009, 17:50
Avatar de Jask  
Fecha de Ingreso: abril-2006
Ubicación: Madrid
Mensajes: 768
Antigüedad: 11 años, 7 meses
Puntos: 15
De acuerdo Ajustar DIV cabecera

Muy buenas a todos :)

Bueno tengo un pequeño problema, me he metido de lleno a maquetar webs con divs y dejar de lado las tablas que ya aburren verdad :P ?
Bueno la cosa es que tengo un pequeño problema.

Tengo un div principal arriba del todo vale? el cual lleva una imagen que se repite el problema es que no cubre el ancho entero de la página, si no que deja unos bordes y no hay manera de que el div llegue a cubrir esos bordes. También deja un pequeño hueco por arriba de este y tampoco se como hacerlo. A ver si alguien es tan amable y me puede decir que comando tengo que usar para que esto desaparezca :)

Un saludo y gracias !!
  #2 (permalink)  
Antiguo 11/11/2009, 17:51
Avatar de Jask  
Fecha de Ingreso: abril-2006
Ubicación: Madrid
Mensajes: 768
Antigüedad: 11 años, 7 meses
Puntos: 15
Respuesta: Ajustar DIV cabecera

Que tonto que soy xD

Bueno la solución es fácil, usando:

padding:0px;
margin:0px;

Perdonar que halla abierto el post para nada :( !!


Antes de abrir otro tema.. me gustaría saber como puedo colocar dentro de un div una imagen en cualquier lugar que yo decida (dentro del div que cité anteriormente)

Para que se hagan una idea es un pequeño logo que quiero ponerle una alineación vertical centrada (probé con vertical-align pero nada)

Un saludo :D
  #3 (permalink)  
Antiguo 11/11/2009, 19:07
Avatar de cristian_cena
Colaborador
 
Fecha de Ingreso: junio-2009
Mensajes: 2.244
Antigüedad: 8 años, 5 meses
Puntos: 269
Respuesta: Ajustar DIV cabecera

Hola Jask:

prueba con la propiedad background-position. O incluye la imagen en un div nuevo y aplicale posicion absoluta (position:absolute;) y luego lo controlas con (top:; right:; left:; bottom:;).

div {
background-image:url(../de/tu/imagen.abc);
position:absolute;
top:;
right:;
left:;
bottom:;
}


Saludos!
  #4 (permalink)  
Antiguo 11/11/2009, 19:12
Avatar de deirdre  
Fecha de Ingreso: mayo-2009
Mensajes: 690
Antigüedad: 8 años, 7 meses
Puntos: 44
Respuesta: Ajustar DIV cabecera

Hola Jask

Una forma puede ser poniendo el div contenedor en posición relativa y la imagen dentro de otro div en posición absoluta, ajustas los valores y se posicionará respecto al primer div en el lugar que quieras (el div de la imagen debe ir dentro del primer div).

Bye

Hola Cristian, te adelantaste (bien hecho). Saludos
  #5 (permalink)  
Antiguo 11/11/2009, 19:18
Avatar de cristian_cena
Colaborador
 
Fecha de Ingreso: junio-2009
Mensajes: 2.244
Antigüedad: 8 años, 5 meses
Puntos: 269
Respuesta: Ajustar DIV cabecera

Gracias camarada, lo que dices es muy interesante, y creo recordarlo de algun sitio, puede ser de araudi.net?
  #6 (permalink)  
Antiguo 11/11/2009, 19:40
Avatar de Jask  
Fecha de Ingreso: abril-2006
Ubicación: Madrid
Mensajes: 768
Antigüedad: 11 años, 7 meses
Puntos: 15
Respuesta: Ajustar DIV cabecera

Perfecto :) gracias a todos por la solución quedó espléndido, cuando termine y lo suba la posteo aquí mismo para que la puedan ver ( en estos días la subiré )

Una cosa que me gustaría preguntar. Tengo un rectángulo bien lindo que me curré con photoshop para que haga de "fondo" para las noticias por ejemplo. Yo estoy acostumbrado (para cuadrarlo) a usar el background de las tablas y recortarlo según valla cuadrando, el problema es que con los divs no tengo ni idea de como hacer eso para que quede bien cuadrado y no se desface, alguna idea :D ?

Saludos a todos ^^
  #7 (permalink)  
Antiguo 12/11/2009, 14:30
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 15 años, 5 meses
Puntos: 361
Respuesta: Ajustar DIV cabecera

Hola:

Jask, para evitar el problema inicial que planteaste buscate información, aquí mismo en el foro, sobre reset css, te evitarás problemas.

Saludos.
  #8 (permalink)  
Antiguo 12/11/2009, 14:38
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: Ajustar DIV cabecera

Cristian y Deirdre
pero...
Mejor prevenimos la "divitis": aplicamos directamente a la imagen la clase: "<img class="clase_aplicada" src="... />

Un saludo
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
  #9 (permalink)  
Antiguo 12/11/2009, 15:51
Avatar de cristian_cena
Colaborador
 
Fecha de Ingreso: junio-2009
Mensajes: 2.244
Antigüedad: 8 años, 5 meses
Puntos: 269
Respuesta: Ajustar DIV cabecera

... y también puedes mirar por esto: http://www.elwebmaster.com/articulos...ernet-explorer

Cita:
Iniciado por kseso? Ver Mensaje
Mejor prevenimos la "divitis"... />
jaja, gracias Kseso?, no la sabía
  #10 (permalink)  
Antiguo 12/11/2009, 17:41
Avatar de Jask  
Fecha de Ingreso: abril-2006
Ubicación: Madrid
Mensajes: 768
Antigüedad: 11 años, 7 meses
Puntos: 15
Respuesta: Ajustar DIV cabecera

jajaja si tenés razón sobre la "divitis" porque al fin y al cabo termino poniendo 20000 millones de tags xD !! la cosa de ser ordenado pero bueno poco a poco. Es la primera vez que maqueto con css y divs y la verdad me gusta un montón el resultado. Te da una libertar que con las tablas no podía :D !!

Gracias a todos :) seguiré echando ojeadas a los manuales jejeje
  #11 (permalink)  
Antiguo 12/11/2009, 17:58
Avatar de cristian_cena
Colaborador
 
Fecha de Ingreso: junio-2009
Mensajes: 2.244
Antigüedad: 8 años, 5 meses
Puntos: 269
Respuesta: Ajustar DIV cabecera

Cita:
Iniciado por Jask Ver Mensaje
Es la primera vez que maqueto con css y divs y la verdad me gusta un montón el resultado. Te da una libertar que con las tablas no podía :D !!

seee, al respecto, me sirvió mucho leer esto:
http://www.forosdelweb.com/f53/aport...ml-css-648073/
http://www.araudi.net/migracion/migr..._parte_II.html

Gracias a todos :) seguiré echando ojeadas a los manuales jejeje

+1 suerte con eso, nos vemos
Saludos!
  #12 (permalink)  
Antiguo 12/11/2009, 19:21
Avatar de Jask  
Fecha de Ingreso: abril-2006
Ubicación: Madrid
Mensajes: 768
Antigüedad: 11 años, 7 meses
Puntos: 15
Sonrisa Respuesta: Ajustar DIV cabecera

Cita:
Iniciado por cristian_cena Ver Mensaje
Saludos!
A mis favoritos que va :) tiene buena.. muy buena pinta :D !!

Gracias por brindarnos esta guía :) !!

Saludos
  #13 (permalink)  
Antiguo 12/11/2009, 21:38
Avatar de deirdre  
Fecha de Ingreso: mayo-2009
Mensajes: 690
Antigüedad: 8 años, 7 meses
Puntos: 44
Respuesta: Ajustar DIV cabecera

Pues claro que sí! estimado kseso?: maldita 'divitis' que nos infecta y contagia.

¿Porqué será que, en ocasiones, mi sudor produce divs en lugar de 'agua'?: la función crea el órgano o el órgano crea la función???

Maldita divitis, voy a intentar vacunarme (no es la primera vez)...

Lo fácil que es:
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>foto centrada dentro de div</title>
<style type="text/css">
#caja {
	width: 500px;
	height: 500px;
	position: relative;
	border: 1px solid #444;
}
.posicion {
	width: 224px;
	height: 300px;
	position: absolute;
	left: 138px;
	top: 100px;
}
</style>

</head>

<body>

<div id="caja">
	<img class="posicion" alt="mi_foto" src="mi_foto.jpg" />
</div>

</body>

</html> 
Bye
  #14 (permalink)  
Antiguo 13/11/2009, 03:15
Avatar de cristian_cena
Colaborador
 
Fecha de Ingreso: junio-2009
Mensajes: 2.244
Antigüedad: 8 años, 5 meses
Puntos: 269
Respuesta: Ajustar DIV cabecera

Cita:
Iniciado por Jask Ver Mensaje
Gracias por brindarnos esta guía :) !!
Saludos
Agradezcamos a mikel.
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 00:54.