Duda/Problema

seifer6993 · #1 (**permalink**) 09/05/2012, 07:51

Hola, os cuento lo que me pasa yo tengo una imagen, ok, pues esta imagen la tengo centrada en mitad de la web (la web va a ser la informacion y todas las imagenes en el centro y por el resto de la pagina nada en blanco)

Y ahora viene el problema yo quiero poner unos textos encima de la imagen en posiciones especificas a si que tengo esto:

<style>

body {
background-attachment: scroll;
background-repeat: no-repeat;
background-color: #FFDEAD;
text-align: center}
}

#Campañas {
position: absolute;
top: 210px;
left: 140px;
color: #FFF;
font-size:20px;

}

.container{

}

</style>
<body>

<div class="container">
<img src="imagenes/prueba.png" alt="" title="" />
<div id="Campañas">Campañas</div>
</div>

</body>

Lo que pasa es que si no alineo la imagen al centro de la pantalla y se queda pegada en el lado izquierdo, el texto se queda en sus posiciones especificas y todo bien, pero cuando alineo la imagen ya el texto se descoloca y a un que lo vuelva a poner con la imagen centrada, al mirarlo en los navegadores se descoloca etc...

Yo pienso que es por el centrado de la imagen, pero no se exactamente, me gustaria que me dijerais alguna solucion

Gracias

Oscar_Hidro · #2 (**permalink**) 09/05/2012, 12:54

Hola seifer6993, no entendi muy bien tu problema.

Cita:

pero cuando alineo la imagen ya el texto se descoloca y a un que lo vuelva a poner con la imagen centrada, al mirarlo en los navegadores se descoloca etc...

Podrias ser un poco mas especifico para poder ayudarte??? Saludos

seifer6993 · #3 (**permalink**) 10/05/2012, 03:56

ejeje, intetare ser mas concreto:

Tengo una huella de imagen (background) centrada en la mitad de la pantalla, y lo que quiero es colocar encima de cada dedo palabras ejemplo: inicio, foro etc..
pero cuando pongo las palabras encima al mirarlo en internet se me descuadra, pero si el background no lo pongo en el centro las palabras se quedan bien posicionadas, como puedo posicionar las palabras encima de la imagen y que estas a la vez que la imagen se encuentren en el centro de la pantalla?

Saludos y gracias

yuo2 · #4 (**permalink**) 10/05/2012, 05:13

Aqui te dejo codigo para que juegues y cuadres mejor lo que pretendes hacer.
Trata de poner ese fondo en un div.

Código CSS:

Ver original<style>
 
body {
background-repeat: no-repeat;
background-color: #FFDEAD;
} 
 
.container{
padding-top:30px;
 
}
 
#fondo {
padding-left:50px;
float:left;
}
#Campañas {
    color: #FFF;
    font-size:20px;
    text-align: center;
}
 
 
</style>
<body>
 
<div class="container">
<div id="fondo"><img src="imagenes/prueba.png" alt="" title="" /></div>
<div id="Campañas">Campañas</div>
</div>
 
</body>

seifer6993 · #5 (**permalink**) 11/05/2012, 06:59

Gracias a todos por la respuesta el codigo me funciono, consigo poner las letras encima de la imagen, porque la imagen la muevo con padding etc... lo que pasa ahora es que al "centrar" la imagen con padding para poder poner las letras encima, en distintos navegadores y resoluciones distintas se descoloca de sitio, y yo quiero que este en el centro, estoy buscando soluciones si podeis aportar algo os lo agradeceria

Saludos