como re-dimensionar un input

Iniciado por Drewermerc, 26 Septiembre 2014, 04:51 AM

0 Miembros y 1 Visitante están viendo este tema.

Imprimir
Ir Abajo Páginas1
Acciones del Usuario

Drewermerc

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.

engel lex

#1
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 (javascript) [Seleccionar]
$( window ).resize(recalcularInput());
y el calculo debe bastar
si no usas jquery
le puedes colocar al div la propiedad "onresize" algo como
Código (html4strict) [Seleccionar]
<div onresize="recalcularInput();">
El problema con la sociedad actualmente radica en que todos creen que tienen el derecho de tener una opinión, y que esa opinión sea validada por todos, cuando lo correcto es que todos tengan derecho a una opinión, siempre y cuando esa opinión pueda ser ignorada, cuestionada, e incluso ser sujeta a burla, particularmente cuando no tiene sentido alguno.

Drewermerc

#2
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 (html4strict) [Seleccionar]

<!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 (css) [Seleccionar]

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.

engel lex

#3
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 [Seleccionar]
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
El problema con la sociedad actualmente radica en que todos creen que tienen el derecho de tener una opinión, y que esa opinión sea validada por todos, cuando lo correcto es que todos tengan derecho a una opinión, siempre y cuando esa opinión pueda ser ignorada, cuestionada, e incluso ser sujeta a burla, particularmente cuando no tiene sentido alguno.

Drewermerc

#4
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.
Imprimir
Ir Arriba Páginas1
Acciones del Usuario