Anchos de textbox según resolución
Recientemente he arreglado un pequeño descuido en la página www.sfpaula.com/campus relacionado con el ancho que puede ocupar una casilla de texto o una capa.
Para entendernos pongamos el ejemplo que he debido resolver, habiendo creado una casilla de texto que sirve para contener todas las direcciones de correo a las que quiero mandar un e-mail, resulta que el cliente introduce 100 direcciones y lo guarda como borrador, al abrirlo de nuevo para modificarlo, se encuentra con esto:
Problema
Me he fijado en otros gestores de correo como hotmail y yahoo, y ellos no tienen ese tipo de problemas porque han colocado unas dimensiones fijas para cada caja de texto sin importar la resolución.
Para mí por cuestiones estéticas quería que la caja llegara hasta el final del lado derecho tanto en 800x600 como en 1024x768 y sin deformarse.
La solución: Utilizar javascript para establecer el ancho fijo adecuado a la resolución.
Se trata de trucos que a veces emplea uno para hacer que se cargue un CSS diferente dependiendo del navegador como ocurre en elpais.com, y así ahorras bastantes kbs y tienes el estilo bastante sectorizado.
Del mismo modo puedes añadir sólo una modificación al documento dependiendo del tamaño de la pantalla. El script es:
if(screen.width <1000){
document.write('');
}
else{
document.write('<style type="text/css">.compose_fields{ width:770px}</style>');
}
y debe ir incluido entre los <HEAD>.
He aquí la captura de la solución:
Solución
Autor: Miguel Ángel González @ 20:40
0 comentarios
