Salve,
ho un campo password cui ho inserito lo show/hide per la visualizzazione della password, nel css se lascio il width: 100% nessun problema se invece imposto il width: 90% (come impostati tutti gli altri campi come quello mail, per una visualizzazione corretta in resposive) si vede così :login.jpg
Come posso ovviare?
Ecco il css e html del form:
P.S. Non mi fa allegare qui il file hideShowPassword.min.jscodice:<style> input{ font-family:Helvetica,Arial,sans-serif; -webkit-border-radius: 5px; -moz-border-radius: 5px; color:#117bb4; background:#FBFBFB none repeat scroll 0 0; border:1px solid #117bb4; font-size:16px; padding: 10px; display: block; width: 90%; } ::-ms-reveal, ::-ms-clear { display: none !important; } .hideShowPassword-toggle { background-color: transparent; background-image: url('../../images/wink.png'); /* fallback */ background-image: url('../../images/wink.svg'), none; background-position: 0 center; background-repeat: no-repeat; border: 2px solid transparent; border-radius: 0.25em; cursor: pointer; font-size: 100%; height: 44px; max-height: 100%; padding: 0; overflow: 'hidden'; text-indent: -999em; width: 46px; -moz-appearance: none; -webkit-appearance: none; } .hideShowPassword-toggle-hide { background-position: -44px center; } .hideShowPassword-toggle:hover, .hideShowPassword-toggle:focus { border-color: #0088cc; outline: transparent; } </style> <form> <input type="text" name="email" placeholder="E-mail *" pattern="[^@\s]+@[^@\s]+\.[^@\s]+" required oninvalid="this.setCustomValidity('Indicare e-mail ')" onchange="this.setCustomValidity('')" value=""><br> <input id="password-1" type="password" type="password" name="password" placeholder="Password *" pattern="(?=^.{6,}$)((?=.*\d)|(?=.*\W+))(?![.\n])(?=.*[A-Z])(?=.*[a-z]).*$" required oninvalid="this.setCustomValidity('Indicare password')" onchange="this.setCustomValidity('')" value=""> </form> <script src="https://code.jquery.com/jquery-2.1.3.min.js"></script> <script src="js/hideShowPassword.min.js"></script> <script> $('#password-1').hidePassword(true); </script>
Grazie per l'aiuto
G.

Rispondi quotando