Foros del Web » Creando para Internet » CSS »

Poner <div> en la esquina superior izquierda

Estas en el tema de Poner <div> en la esquina superior izquierda en el foro de CSS en Foros del Web. Hola muy buenas a todos, tengo un problema a la hora de situar un <div> con una imagen dentro a la esquina superior izquerda. No ...
  #1 (permalink)  
Antiguo 08/04/2008, 11:52
 
Fecha de Ingreso: abril-2008
Mensajes: 38
Antigüedad: 9 años, 8 meses
Puntos: 0
Poner <div> en la esquina superior izquierda

Hola muy buenas a todos, tengo un problema a la hora de situar un <div> con una imagen dentro a la esquina superior izquerda. No se me encjaba y al CSS puse lo siguiente:

#links {
font-size: 11px; font-family: Verdana,Arial,Helvetica;
background-color:#0F0084;
color:#FFFFFF;
top:0px;
left:0px;
margin-top:-10px;
margin-left:0px;
padding-top:1px;
width:560px;
padding-left:230px;
}
Con IE y Firefox se ve un poco distinto. Pensaba que sin decirle nada ya se pondria en la esquina. ¿Hay otra forma de hacerlo?

Gracias
  #2 (permalink)  
Antiguo 08/04/2008, 11:57
Avatar de baccxus  
Fecha de Ingreso: mayo-2005
Ubicación: Panama city, Panama, Panama
Mensajes: 870
Antigüedad: 12 años, 6 meses
Puntos: 17
Re: Poner <div> en la esquina superior izquierda

Te faltó poner "position".

Saludos
__________________
Al final del día hablar es gratis, codificar no lo es
  #3 (permalink)  
Antiguo 08/04/2008, 13:00
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Re: Poner <div> en la esquina superior izquierda

Si añades esto a tu css seguramente se verá igual en FF y en IE6:

* {margin: 0px;
padding: 0px;
}

Y además, efectivamente como te dice baccxus, si no pones "position" los parámetros top:0px; y left:0px; no te sirven de nada.

Si lo pones así, seguro que se te pega arriba y a la izquierda:

Cita:
* {margin: 0px; padding: 0px;
}
#links {
font-size: 11px; font-family: Verdana,Arial,Helvetica;
background-color:#0F0084;
color:#FFFFFF;
width:560px;
}
Mikel.
  #4 (permalink)  
Antiguo 09/04/2008, 02:23
 
Fecha de Ingreso: abril-2008
Mensajes: 38
Antigüedad: 9 años, 8 meses
Puntos: 0
Re: Poner <div> en la esquina superior izquierda

¿Por que el *?
  #5 (permalink)  
Antiguo 09/04/2008, 03:46
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Re: Poner <div> en la esquina superior izquierda

El asterisco significa "todo", es decir, cualquierelemento, de manera que con eso lo que haces es eliminar el posible margen o padding que tienen algunos elementos de forma predeterminada. Es una buena práctica para evitar sorpresas (aunque algunas son inevitables aun así).

Mikel.
  #6 (permalink)  
Antiguo 09/04/2008, 04:23
 
Fecha de Ingreso: abril-2008
Mensajes: 38
Antigüedad: 9 años, 8 meses
Puntos: 0
Re: Poner <div> en la esquina superior izquierda

Entiendo. Igualmente en #links puedo poner el padding-top:1px; ¿no?

Muchas gracias Mikel
  #7 (permalink)  
Antiguo 09/04/2008, 04:59
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Re: Poner <div> en la esquina superior izquierda

Sí, desde luego, sin problema.

Mikel.
  #8 (permalink)  
Antiguo 09/04/2008, 05:27
 
Fecha de Ingreso: abril-2008
Mensajes: 38
Antigüedad: 9 años, 8 meses
Puntos: 0
Re: Poner <div> en la esquina superior izquierda

Pero... si * es todo, no lo hara a todas las capas? yo tengo mas capas. Solo me interessa la capa de id=links.

Es lo que he estado pensando ahora, porque de momento no lo puedo probar hasta la tarde lo del *.
  #9 (permalink)  
Antiguo 09/04/2008, 05:43
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Re: Poner <div> en la esquina superior izquierda

Cita:
Iniciado por Bernix Ver Mensaje
Entiendo. Igualmente en #links puedo poner el padding-top:1px; ¿no?
Pero aquí dices de ponerle el padding sólo a #links, y eso es lo que te digo que no tiene ningún problema.

La norma genérica del asterisco (*) afectará a todos los elementos, mientras un elemento no la contradiga. Si un elemento no lleva padding, pues el asterisco le dice que sea cero, pero si lleva un padding, este prevalece por encima del genérico.

Mikel.
  #10 (permalink)  
Antiguo 09/04/2008, 09:35
 
Fecha de Ingreso: abril-2008
Mensajes: 38
Antigüedad: 9 años, 8 meses
Puntos: 0
Re: Poner <div> en la esquina superior izquierda

oki oki ahora si jeje

gracias
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 05:26.