Hola Marlene,
prueba en definir un estilo en el css para los input con vertical-align:middle
y quitar las etiquetas <span>.
pego el código modificado.
un saludo
<html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style>
BODY {
background : #C0D9D9;
color : #666666;
margin : 20px 0px 20px 0px;
text-align: center;
}
#contenedor{
text-align: left;
width: 700px;
background-color : #ffffff;
margin: auto;
}
#cadena{
font-size:9px;
font-family:Verdana, Arial, Helvetica, sans-serif;
width:114px;
border-bottom:1px solid #666666;
border-top:1px solid #666666;
border-left:1px solid #666666;
border-right:none;
}
form{
margin:0px;
padding:0px;
}
input{vertical-align:middle;}
</style>
</head>
<body>
<div id="contenedor">
<form action="" method="get">
<div>
<input name="cadena" id="cadena" type="text" value="dalia" /><input name="btn"
id="btn" type="image" src="ir.gif" />
</div>
</form>
</div>
</body>
</html>
-----Mensaje original-----
De: [EMAIL PROTECTED]
[mailto:[EMAIL PROTECTED] nombre de Marlene
Enviado el: martes, 24 de octubre de 2006 14:15
Para: Ovillo, la lista de CSS en castellano
Asunto: Re: [Ovillo] El uso del vertical align
Es que yo no ando buscando centrado sino alineacion entre dos elementos y no
consigo hacerlo de una forma que funcione igual para varios navegadores
----- Original Message -----
From: "Nacho F. Carreño" <[EMAIL PROTECTED]>
To: "Ovillo, la lista de CSS en castellano" <ovillo@lists.ovillo.org>
Sent: Tuesday, October 24, 2006 6:18 AM
Subject: Re: [Ovillo] El uso del vertical align
Hola Marlece
Creo que una solución sería añadir a #cadena el estilo margin-top:8px; por
ejemplo e ir probando hasta que te quede centrado como tu quieres.
Un saludo,
Nacho
----- Original Message -----
From: "Marlene" <[EMAIL PROTECTED]>
To: "Ovillo, la lista de CSS en castellano" <ovillo@lists.ovillo.org>
Sent: Monday, October 23, 2006 8:57 PM
Subject: [Ovillo] El uso del vertical align
Hola listeros, me dirijo a uds a ver quien puede ayudarme mi nombre es
Marlene y ando algo perdida en el uso del vertical-align. Mi problema es que
deseo alinear un elemento de tipo texto (input) con otro elemento de tipo
imagen dentro de un formulario.
Esto que les mando solo se ve bien en Opera en los demas navegadores como
Mozilla, IE, Netscape se ve mal.
Por favor que alguien me indique como alinear bien estos dos elementos.
La imagen que deseo alinear con el input se las envio adjunta al mensaje
Código que escribí:
<html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style>
BODY {
background : #C0D9D9;
color : #666666;
margin : 20px 0px 20px 0px;
text-align: center;
}
#contenedor{
text-align: left;
width: 700px;
background-color : #ffffff;
margin: auto;
}
#cadena{
font-size:9px;
font-family:Verdana, Arial, Helvetica, sans-serif;
width:114px;
border-bottom:1px solid #666666;
border-top:1px solid #666666;
border-left:1px solid #666666;
border-right:none;
}
form{
margin:0px;
padding:0px;
}
</head>
<body>
<div id="contenedor">
<form action="" method="get">
<div>
<span style="vertical-align:top;"><input name="cadena" id="cadena"
type="text" value="dalia" /></span><span
style="vertical-align:middle;"><input name="btn" id="btn" type="image"
src="ir.gif" /></span>
</div>
</form>
</div>
</body>
</html>
Gracias de antemano.
mmm
__________ Información de NOD32, revisión 1.1825 (20061022) __________
Este mensaje ha sido analizado con NOD32 antivirus system
http://www.nod32.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
__________ Información de NOD32, revisión 1.1825 (20061022) __________
Este mensaje ha sido analizado con NOD32 antivirus system
http://www.nod32.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
__________ NOD32 1.1806 (20061017) Information __________
This message was checked by NOD32 antivirus system.
http://www.eset.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
_______________________________________________
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
