Scrambled input icon

Navigation
-1

I have an input of typo password with span where is the bootstrap icon is misaligned, only buga with type password, type text works normally 

<div class="panel-body">
                    <form class="form-signin" method="POST" action="valida_login.php">
                        <fieldset>
                            <div style="margin-bottom: 25px" class="input-group">
                                <span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
                                <input class="form-control" placeholder="Digite seu usuario.." name="usuario" type="text" required autofocus>
                            </div>
                            <div style="margin-bottom: 25px" class="input-group">
                                <span class="input-group-addon"><i class="glyphicon glyphicon-lock"></i></span>
                                <input class="form-control" placeholder="Digite sua senha.." name="senha" type="password" required autofocus>
                            </div>
                            <a class="text-center text-danger" href="" style="float: right; font-size: 12px">Esqueceu sua senha?</a>
                            <br><br>
                            <button class="btn btn-primary btn-block mb-10" type="submit" style="background-color: #027CC1; border: solid 1px #027CC1"><i class="fa fa-check"></i> Entrar</button>
                        </fieldset>
                    </form>
                    <p class="text-center text-danger">
                        <?php
                            if(isset($_SESSION['loginErro'])){
                                echo $_SESSION['loginErro'];
                                unset($_SESSION['loginErro']);
                            }
                        ?>
                    </p>
                </div>

    
asked by anonymous 13.02.2017 / 21:26

1 answer

0

As can be seen below, no inconsistency in the html output can be observed! I suggest reviewing the html markup and ordering of style and script files. 

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script><scriptsrc="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<div class="container">
	<div class="panel">
        <div class="panel-body">
            <form class="form-signin" method="POST" action="#">
                <fieldset>
                    <div style="margin-bottom: 25px" class="input-group">
                        <span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
                        <input class="form-control" placeholder="Digite seu usuario.." name="usuario" type="text" required autofocus>
                    </div>
                    <div style="margin-bottom: 25px" class="input-group">
                        <span class="input-group-addon"><i class="glyphicon glyphicon-lock"></i></span>
                        <input class="form-control" placeholder="Digite sua senha.." name="senha" type="password" required autofocus>
                    </div>
                    <a class="text-center text-danger" href="" style="float: right; font-size: 12px">Esqueceu sua senha?</a>
                    <br><br>
                    <button class="btn btn-primary btn-block mb-10" type="submit" style="background-color: #027CC1; border: solid 1px #027CC1"><i class="fa fa-check"></i> Entrar</button>
                </fieldset>
            </form>        
        </div>
    </div>
</div>
    
13.02.2017 / 21:36
Cache Redis on Azure Add content in element that contains the "element" data-layer in the tag