Re: [Ovillo] Texto centrado respecto al ancho de una imagen
Hola Javier!
Finalmente lo que he hecho ha sido introducir como tu dices dos divs, y
posicionarlo con top,left y margin.
div#pie{
clear: both;
width: 100%;
color:#8b7e75;
height:80px;
overflow:auto;
border-top:6px solid #ff6600;
}
div#logoPie{
position:relative;
top:0px;
left:190px;
width:32px;
}
div#textoPie{
position:relative;
top:-25px;
left:50%;
margin-left:-155px;
width:360px;
text-align:center;
}
div id=pie
div id=logoPie
img src=lib/pics/logoIcon.gif alt=texto alternativo/
/div
div id=textoPie
Primera linea de texto
br/
Segunda linea de texto
/div
/div
Muchas gracias a todos. :)
Saludos cordiales,
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
[Ovillo] Texto centrado respecto al ancho de una imagen
Supongo que será una tontería, pero llevo un par de horas buscando como
hacerlo y no lo logro.
Tengo un pie de pagina que incluye una imagen y un par de líneas de texto,
centrados horizontalmente respecto al pie. Lo que intento hacer es que
además el texto quede centrado verticalmente respecto a la imagen, pero no
lo consigo. He realizado varios intentos pero no lo he conseguido. ¿Alguna
sugerencia?
1er intento:
div#pie{
clear: both;
width: 100%;
text-align:center;
color:#8b7e75;
height:80px;
overflow:auto;
border-top:6px solid #ff6600;
padding-top:10px;
}
img#icono { vertical-align:middle;}
div id=pie
img id=icono src=lib/pics/logoIcon.gif alt=texto
alternativo/ Primera linea de texto
br/
Segunda linea de texto
/div
Resultado Imagen y texto centrado horizontalmente respecto al div
contenedor, pero sólo una de las lineas de texto (la primera) aparecen
centradas verticalmente respecto a la imagen, la segunda queda por debajo.
2o intento: intento agrupar las dos lineas dentro de un elemento para
intentar que queden las dos lineas centradas
div#pie{
clear: both;
width: 100%;
text-align:center;
color:#8b7e75;
height:80px;
overflow:auto;
border-top:6px solid #ff6600;
padding-top:10px;
}
img#icono { vertical-align:middle;}
p {display:inline;}
div id=pie
img id=icono src=lib/pics/logoIcon.gif alt=texto
alternativo/ p
Primera linea de texto
br/
Segunda linea de texto
/p
/div
Resultado mismo resultado que caso anterior.
Alguna ayudita?
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Texto centrado respecto al ancho de una imagen
On 9/18/06, AraDaen [EMAIL PROTECTED] wrote:
Supongo que será una tontería, pero llevo un par de horas buscando como
hacerlo y no lo logro.
Tengo un pie de pagina que incluye una imagen y un par de líneas de texto,
centrados horizontalmente respecto al pie. Lo que intento hacer es que
además el texto quede centrado verticalmente respecto a la imagen, pero no
lo consigo. He realizado varios intentos pero no lo he conseguido. ¿Alguna
sugerencia?
1er intento:
div#pie{
clear: both;
width: 100%;
text-align:center;
color:#8b7e75;
height:80px;
overflow:auto;
border-top:6px solid #ff6600;
padding-top:10px;
}
img#icono { vertical-align:middle;}
div id=pie
img id=icono src=lib/pics/logoIcon.gif alt=texto
alternativo/ Primera linea de texto
br/
Segunda linea de texto
/div
Resultado Imagen y texto centrado horizontalmente respecto al div
contenedor, pero sólo una de las lineas de texto (la primera) aparecen
centradas verticalmente respecto a la imagen, la segunda queda por debajo.
2o intento: intento agrupar las dos lineas dentro de un elemento para
intentar que queden las dos lineas centradas
div#pie{
clear: both;
width: 100%;
text-align:center;
color:#8b7e75;
height:80px;
overflow:auto;
border-top:6px solid #ff6600;
padding-top:10px;
}
img#icono { vertical-align:middle;}
p {display:inline;}
div id=pie
img id=icono src=lib/pics/logoIcon.gif alt=texto
alternativo/ p
Primera linea de texto
br/
Segunda linea de texto
/p
/div
Resultado mismo resultado que caso anterior.
Alguna ayudita?
Hmmm, yo pondria el div con la imagen dentro y luego un span o p para
meter el texto dentro, asi podes usar el margin o padding del span o p
para mover el texto a mano, o incluso posicionarlo relativamente y
usar top para moverlo.
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
--
Hermann Kaser
http://www.theragingche.com/
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Texto centrado respecto al ancho de una imagen
Asias por la ayuda, he optado por meterlo en un div y posicionarlo. Gracias :) ___ Lista de distribución Ovillo Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Texto centrado respecto al ancho de una imagen
AraDaen:
Probaste poner dentro del pie 2 divs más uno con el texto y otro con la
imagen y luego centrarlos con margin??
Espero que esta solución sirva.
Saludos.
-Mensaje original-
De: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED]
En nombre de AraDaen
Enviado el: Lunes, 18 de Septiembre de 2006 07:32
Para: 'Ovillo, la lista de CSS en castellano'
Asunto: [Ovillo] Texto centrado respecto al ancho de una imagen
Supongo que será una tontería, pero llevo un par de horas buscando como
hacerlo y no lo logro.
Tengo un pie de pagina que incluye una imagen y un par de líneas de texto,
centrados horizontalmente respecto al pie. Lo que intento hacer es que
además el texto quede centrado verticalmente respecto a la imagen, pero no
lo consigo. He realizado varios intentos pero no lo he conseguido. ¿Alguna
sugerencia?
1er intento:
div#pie{
clear: both;
width: 100%;
text-align:center;
color:#8b7e75;
height:80px;
overflow:auto;
border-top:6px solid #ff6600;
padding-top:10px;
}
img#icono { vertical-align:middle;}
div id=pie
img id=icono src=lib/pics/logoIcon.gif alt=texto
alternativo/ Primera linea de texto
br/
Segunda linea de texto
/div
Resultado Imagen y texto centrado horizontalmente respecto al div
contenedor, pero sólo una de las lineas de texto (la primera) aparecen
centradas verticalmente respecto a la imagen, la segunda queda por debajo.
2o intento: intento agrupar las dos lineas dentro de un elemento para
intentar que queden las dos lineas centradas
div#pie{
clear: both;
width: 100%;
text-align:center;
color:#8b7e75;
height:80px;
overflow:auto;
border-top:6px solid #ff6600;
padding-top:10px;
}
img#icono { vertical-align:middle;}
p {display:inline;}
div id=pie
img id=icono src=lib/pics/logoIcon.gif alt=texto
alternativo/ p
Primera linea de texto
br/
Segunda linea de texto
/p
/div
Resultado mismo resultado que caso anterior.
Alguna ayudita?
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org Puedes
modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
--
No virus found in this incoming message.
Checked by AVG Free Edition.
Version: 7.1.405 / Virus Database: 268.12.4/449 - Release Date: 15/09/2006
--
No virus found in this outgoing message.
Checked by AVG Free Edition.
Version: 7.1.405 / Virus Database: 268.12.4/449 - Release Date: 15/09/2006
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
