Foros del Web » Creando para Internet » CSS »

Problema al centrar fondo CSS

Estas en el tema de Problema al centrar fondo CSS en el foro de CSS en Foros del Web. Hola amigos. Les vengo a pedir ayuda. Tengo varios fondos centrados en el mismo CSS. Pero el problema es que el código me funcionó perfecto ...
  #1 (permalink)  
Antiguo 03/01/2013, 23:56
 
Fecha de Ingreso: enero-2013
Ubicación: Argentina
Mensajes: 3
Antigüedad: 11 años, 2 meses
Puntos: 0
Pregunta Problema al centrar fondo CSS

Hola amigos.

Les vengo a pedir ayuda.
Tengo varios fondos centrados en el mismo CSS. Pero el problema es que el código me funcionó perfecto con posisión: "fixed", ahora yo quiero que continúe centrado pero que al usar la barra de desplazamiento, el fondo no se quede quieto, sino que suba al igual que el contenido. Probe colocandole posisión: "absolute" pero no logre el resultado que quería, los fondos no se visualizaron correctamente y se veía la mitad de ellos solamente.

Aca adjunto el codigo:

<style type="text/css"><!--
body{
background-image: url('imagen1.png'), url('imagen2.png'), url('imagen3.png'), url('imagen4.jpg');
background-position: center center;
background-repeat: no-repeat;
background-attachment: absolute;
background-color: #000000;
}
--></style>


Espero que me puedan ayudar, muchas gracias por leer! Saludos!
  #2 (permalink)  
Antiguo 04/01/2013, 06:47
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.488
Antigüedad: 21 años, 7 meses
Puntos: 2114
Respuesta: Problema al centrar fondo CSS

Puedes usar el valor scroll en background-attachment, o directamente eliminar background-attachment porque si no se especifica tomará el valor por defecto que es el que quieres; scroll.
  #3 (permalink)  
Antiguo 05/01/2013, 14:00
 
Fecha de Ingreso: enero-2013
Ubicación: Argentina
Mensajes: 3
Antigüedad: 11 años, 2 meses
Puntos: 0
Pregunta Respuesta: Problema al centrar fondo CSS

Lo intenté, pero el fondo se comportó igual que cuando indico su fijación (attachment) en "absolute". Intento cambiar algo en donde indico su posisión, yo indiqué "center center" ya que si lo cambio no se centra el fono, pero asi mismo no logro nada
  #4 (permalink)  
Antiguo 05/01/2013, 14:43
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.488
Antigüedad: 21 años, 7 meses
Puntos: 2114
Respuesta: Problema al centrar fondo CSS

En realidad eso de absolute no existe. Los valores que puede tener background-attachment son scroll —por defecto— fixed e inherit.

Si quieres que se mueva junto al resto del sitio, es decir, según su comportamiento normal, elimina directamente background-attachment. Aunque, ya que indicas absolute, no debería de tomarte esa regla ya que no es válida e ignorarla.

Estarás haciendo alguna otra cosa mal o explicándote mal.
  #5 (permalink)  
Antiguo 05/01/2013, 15:12
Avatar de ryugen
Colaborador
 
Fecha de Ingreso: agosto-2008
Ubicación: Rosario, Santa Fe
Mensajes: 350
Antigüedad: 15 años, 6 meses
Puntos: 187
Respuesta: Problema al centrar fondo CSS

A ver.. En este ejemplo que armé: http://jsfiddle.net/VQHBT/

Tengo las imagenes de fondo centradas y que se mueven junto con el scroll de la página. Es eso lo que se quiere lograr? O es que no estoy entendiendo la consigna?
  #6 (permalink)  
Antiguo 05/01/2013, 15:27
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.488
Antigüedad: 21 años, 7 meses
Puntos: 2114
Respuesta: Problema al centrar fondo CSS

Cita:
Iniciado por matoecatalan Ver Mensaje
ahora yo quiero que continúe centrado pero que al usar la barra de desplazamiento, el fondo no se quede quieto
Yo entendí que quiere que el fondo se mueva, es decir, que tenga un comportamiento normal.

Aunque también es verdad que los casos extraños los entiendo al revés a veces.
  #7 (permalink)  
Antiguo 07/01/2013, 11:26
 
Fecha de Ingreso: enero-2013
Ubicación: Argentina
Mensajes: 3
Antigüedad: 11 años, 2 meses
Puntos: 0
Respuesta: Problema al centrar fondo CSS

Cita:
Iniciado por Bonez Ver Mensaje
En realidad eso de absolute no existe. Los valores que puede tener [URL="http://www.librosweb.es/referencia/css/background-attachment.html"]background-attachment[/URL] son scroll —por defecto— fixed e inherit.

Si quieres que se mueva junto al resto del sitio, es decir, según su comportamiento normal, elimina directamente background-attachment. Aunque, ya que indicas absolute, no debería de tomarte esa regla ya que no es válida e ignorarla.

Estarás haciendo alguna otra cosa mal o explicándote mal.
Lo que quiero lograr es que las imagenes de fondo esten centradas, pero que cuando use la barra de desplazamiento este NO se quede quieto y SUBA al igual que el contenido. Espero que se entienda. Intenté sacando el valor "background-attachment" pero el fondo no se centra sino que se sube dejando ver solo la mitad de las imagenes.

Cita:
Iniciado por ryugen Ver Mensaje
A ver.. En este ejemplo que armé: [url]http://jsfiddle.net/VQHBT/[/url]

Tengo las imagenes de fondo centradas y que se mueven junto con el scroll de la página. Es eso lo que se quiere lograr? O es que no estoy entendiendo la consigna?
No, porque el fondo en ese ejemplo sigue quieto al usar el scroll de la pagina, yo quiero que al igual que el texto, el fondo suba y se despliegue igual que el contenido.
  #8 (permalink)  
Antiguo 08/01/2013, 09:15
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.488
Antigüedad: 21 años, 7 meses
Puntos: 2114
Respuesta: Problema al centrar fondo CSS

Pues lo dicho, te bastaría con no definir background-attachment, tal que así:

Código CSS:
Ver original
  1. body{
  2. background-image: url('imagen1.png'), url('imagen2.png'), url('imagen3.png'), url('imagen4.jpg');
  3. background-position: center center;
  4. background-repeat: no-repeat;
  5. background-color: #000000;
  6. }

Así quedarían las cuatro imágenes centradas, sin repetirse y moviéndose junto al resto de la página con un fondo negro.

Si sigue sin funcionar, entonces será alguna otra cosa que tengas mal planteada. En tal caso pásanos una URL para verlo.

Etiquetas: fixed, fondo, centrar
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 16:05.