Foros del Web » Creando para Internet » CSS »

posicionar objeto independiente del contenido

Estas en el tema de posicionar objeto independiente del contenido en el foro de CSS en Foros del Web. que tal gente tengo unas cajitas que tienen enlaces y les quiero poner un boton en la esquina inferior derecha que se quede en posicion ...
  #1 (permalink)  
Antiguo 10/05/2012, 13:24
Avatar de catpaw  
Fecha de Ingreso: mayo-2010
Ubicación: xalapa
Mensajes: 856
Antigüedad: 11 años, 8 meses
Puntos: 23
posicionar objeto independiente del contenido

que tal gente

tengo unas cajitas que tienen enlaces y les quiero poner un boton en la esquina inferior derecha que se quede en posicion absoluta ahi sin importar cuantos enlaces haya en las cajitas algo asi:



y resulta que lo que pasa es que por ejemplo si hay muchos enlaces el boton se posiciona de acuerdo al ultimo enlace, queda algo asi:



este es el css

Código:
#cajas_atajos{  //Esta es la caja (color negro)
	background-color:#FFF;
	display:block;
	float:left;
	text-align:left;
	font-size:12px;
	width:332px;
	height:200px;
	margin:2px;
	padding:5px;
	line-height:15px;
}
#cajas_atajos .ver_cat{ //esta es la clase del boton (color rojo)
	padding:2px;
	border:1px solid #999;
	margin-top:40px;
	margin-left:285px;
	cursor:pointer;
	font-size:10px;
	position:absolute;
	z-index:1;
}
#cajas_atajos ul{ //los enlaces los pongo en lista (color azul)
	margin-top:5px;
	margin-left: 0;
	padding-left: 0;
	list-style-type: circle;
	color:#C30;
}
#cajas_atajos li{ 
	margin-left: 1.2em;
}
gracias de antemano
  #2 (permalink)  
Antiguo 10/05/2012, 13:55
 
Fecha de Ingreso: mayo-2012
Mensajes: 21
Antigüedad: 9 años, 8 meses
Puntos: 5
Respuesta: posicionar objeto independiente del contenido

Hola,

Prueba dándole un top, por ejemplo

Código CSS:
Ver original
  1. top: 100px;

Creo que por eso es que no se posiciona, prueba y nos cuentas,

Saludos,
  #3 (permalink)  
Antiguo 10/05/2012, 14:06
Avatar de cristian_cena
Colaborador
 
Fecha de Ingreso: junio-2009
Mensajes: 2.244
Antigüedad: 12 años, 7 meses
Puntos: 269
Respuesta: posicionar objeto independiente del contenido

No se ve la primer imagen.
Prueba con:
Código CSS:
Ver original
  1. #cajas_atajos{
  2. position:relative;
  3. /*...etc...*/
  4. }
  5. #cajas_atajos .ver_cat{
  6. position:absolute;
  7. right:25px;
  8. bottom:25px;
  9. /*...etc...*/
  10. }
  #4 (permalink)  
Antiguo 10/05/2012, 14:09
Avatar de IsaBelM
Colaborador
 
Fecha de Ingreso: junio-2008
Mensajes: 5.032
Antigüedad: 13 años, 7 meses
Puntos: 1011
Respuesta: posicionar objeto independiente del contenido

Cita:
padding:2px;
border:1px solid #999;
margin-top:40px;
margin-left:285px;

cursor:pointer;
font-size:10px;
position:absolute;
position: relative;
top: 190px;
left: 215px

z-index:1;
lo que está en rojo es eliminarlo y lo que está en azul es añadirlo (los valores de top y left en una mera estimación)
el elemento ver_cat ha de ir antes de la lista

necesitas leer sobre la posición absolute y relative
__________________
if(ViolenciaDeGénero) {alert('MUJER ASESINADA');}

Etiquetas: contenido, html, independiente, objeto, 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 07:17.