input con width=100% no funciona como debe

Marche · #1 (**permalink**) 24/07/2007, 14:52

Hola. Tengo un input text que tiene una clase que le da el width al 100% para que se ajuste al tamaño de su contendor. Esto funciona bien cuando el input no tiene nada o tiene poco texto, pero cuando el input tiene un texto muy largo pareciera que el ancho se ajusta al largo del texto y no al ancho del contenedor. Aclaro que en FF anda bien, el problema es con IE

. Alguien sabe como arreglar esto?? Gracias.

Kailu · #2 (**permalink**) 25/07/2007, 17:07

ah pues... recreé tu código (sin ver tu código) y no tuve ningún problema, así lo hice yo, si no te queda, por favor pon tu código para que te pueda ayudar.

Código HTML:

<html>
<head>
<title>titulo</title>
<style>
.form {
width:100%;
}
</style>
</head>
<body>
<div style="width:300px;">
<input type="text" class="form" maxlength="100">
</div>

</body>
</html>

Funcionó bien con IE 6.0 y FF 2.0.0.5

Kailu · #3 (**permalink**) 25/07/2007, 17:15

omite esto, tuve un problema con mi señal de Internet

Marche · #4 (**permalink**) 26/07/2007, 07:05

Aca hay un ejemplo del código que me da problemas. Si te fijas el problema me da cuando pongo el input en una tabla

.No anda en IE 6 ni IE 7

Código HTML:

<html>
<head>
<title>titulo</title>
<style>
.form {
width:100%;
padding:2px;
}
</style>
</head>
<body>

<div style="width:300px; border: 1px solid #333; padding: 2px;">
<input type="text" class="form" />
</div>
<br />
<div style="width:300px; border: 1px solid #333; padding: 2px;">
<input type="text" class="form" value="sdfaldfjasjfalksjflkasflkasdflkasdlkfjasdlkfjasldkjfalskdjflaksjdflakjsdflkajsdlfkjasldkfjaslkdfjalksdjflaksdjflaksjdflkajsdlkfjalskdfjalksdjflkasjlaksjdflkasjflkajsd sadf&ntilde;kjasd&ntilde;fka&ntilde;lsdkf&ntilde;laksd&ntilde;flka&ntilde;sdfasdfaishdgklsadjglaisjdgajsd&ntilde;fjas&ntilde;dlgjas&ntilde;ldgka&ntilde;sldg&ntilde;lsakdg" />
</div>
<br />

<table border="1" cellpadding="2" cellspacing="0" width="300">
	<tr>
		<td width="100">UNO</td>
		<td width="200"><input type="text" class="form" /></td>
	</tr>
	<tr>
		<td>DOS</td>
		<td><input type="text" class="form" value="sdfaldfjasjfalksjflkasflkasdflkasdlkfjasdlkfjasldkjfalskdjflaksjdflakjsdflkajsdlfkjasldkfjaslkdfjalksdjflaksdjflaksjdflkajsdlkfjalskdfjalksdjflkasjlaksjdflkasjflkajsd sadf&ntilde;kjasd&ntilde;fka&ntilde;lsdkf&ntilde;laksd&ntilde;flka&ntilde;sdfasdfaishdgklsadjglaisjdgajsd&ntilde;fjas&ntilde;dlgjas&ntilde;ldgka&ntilde;sldg&ntilde;lsakdg" /></td>
	</tr>	
</table>

</body>
</html>