Imprimir Página - como re-dimensionar un input

Título: como re-dimensionar un input
Publicado por: Drewermerc en 26 Septiembre 2014, 04:51 am

Hola a todos.
Bueno tengo un problema y es que cuando re-dimensiono mi pagina web el input tipo text y password no se re-dimensionan y se salen del div.
y quisiera saber si hay alguna forma de que se acoplen al div.

bueno espero me puedan ayudar.
Saludos.
Drewermerc.

Título: Re: como re-dimensionar un input
Publicado por: engel lex en 26 Septiembre 2014, 05:14 am

puedes hacerlos en porcentaje en css o hacerlo por formula en jscript

si usas jquery con un

Código

$( window ).resize(recalcularInput());

y el calculo debe bastar
si no usas jquery
le puedes colocar al div la propiedad "onresize" algo como

Código

<div onresize="recalcularInput();">

Título: Re: como re-dimensionar un input
Publicado por: Drewermerc en 26 Septiembre 2014, 05:31 am

Hola angel lex.
Gracias por responder.
Bueno intente los dos métodos y no me funcionaron aun siguen sin re-dimensionarse los input text.
aquí dejo e código que tengo.

Código

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang = "es">
	<head>
		<title>prueba</title>
		<meta name="description" content="prueba" />
		<meta name="keywords" content="prueba, uno" />
		<meta http-equiv="Content-type" content="text/html: charset=iso-8859-1" />
		<link rel="StyleSheet" type="text/css" href="css/style-main.css" media="screen" />
		<script src="js/jquery-2.1.1.js" language="javascript" type="text/javascript"></script>
		<script>
			$( window ).resize(recalcularInput());	
		</script>
	</head>
	<body>
		<div id="wrapper-main">	
			<div id="wrapper">
				<div id="form-session">
					<form id="sistema-login" name="form-login" enctype="text/plain" method="post" action="alumnos/default.php">
						<br />
						<label name="message-form">Inicio de sesi&otilde;n</label>
						<br />
						<label name="nom-user">Usuario:</label>
						<br />
						<input id="login" type="text" enctype="text/plain" size="15"/>
						<br />
						<label name="password-user">Contrase&ntilde;a:</label>
						<br />
						<input id="password" type="password" enctype="text/plain" size="15" />
						<br />
						<input id="send" type="button" value="Entrar" />
					</form>	
				</div>
			</div>
		</div>
	</body>
</html>

Código

body, html{
	height: 100%;
	width: 100%;
	margin: 0px;
	padding: 0px;
	background: #ccc;
}
#wrapped-main, #wrapped{
	width: 100%;
	height:100%;
	margin: 0px;
	padding: 0px;
}
#form-session{
	position: absolute;
	width: 20%;
	height: 30%:
	margin-left: 45%;
	margin-top: 5%;
	background-color: #c1c1c1;
}
#send{
	margin-left: 30%;
}

Saludos.
Drewermerc.

Título: Re: como re-dimensionar un input
Publicado por: engel lex en 26 Septiembre 2014, 05:50 am

algún día verás esto y te reirás y preguntarás "que cara.. hice?" :xD

Código:

recalcularInput()

no es una función predefinida del sistema, la tienes que hacer tu jejeje! :xD
con ".width()" puedes ver el ancho del div y con ".width(ancho)" puedes aplicarlo a los inputs

por cierto, en el css, el porcentaje era para los input directamente

Título: Re: como re-dimensionar un input
Publicado por: Drewermerc en 26 Septiembre 2014, 06:55 am

Hola angel lex.
:xD creo que si pero bueno aprenderé jquery y un poco mas de javascript.
y gracias por tu ayuda con el porcentaje en css me funciono bien.

Saludos.
Drewermerc.

Foro de elhacker.net

Programación => Desarrollo Web => Mensaje iniciado por: Drewermerc en 26 Septiembre 2014, 04:51 am