HTMLパスワードが同じではない

Question

私はこのHTMLページを行っていますが、なぜこの2つのパスワード領域が同じサイズでないのかわかりません。最初のものから100％同一のコピーペーストを作成しました。 私はちょうど学期のプロジェクトのための神話の最初のHTMLページを作り始め、助けを必要としました。

は、私はそれはそれはこのようになりますどのように見えるかを確認する場合：

</script> 
 
<div show/hide password> 
 
<script> 
 
function pass(){ 
 
    var d=document.getElementById('s1'); 
 
    var e=document.getElementById('show_f').value; 
 
    var f=document.getElementById('show_f').type; 
 

 
    if(d.value=="show"){ 
 
     var f= document.getElementById('show_f').type="text"; 
 
     var g=document.getElementById('show_f').value=e; 
 
     d.value="Hide"; 
 

 
    } else{ 
 
     var f= document.getElementById('show_f').type="password"; 
 
     var g=document.getElementById('show_f').value=e; 
 
     d.value="show"; 
 
    }  
 
    } 
 
    </script> 
 
    <script> 
 
function pass2(){ 
 
    var d=document.getElementById('s2'); 
 
    var e=document.getElementById('show_g').value; 
 
    var f=document.getElementById('show_g').type; 
 

 
    if(d.value=="show"){ 
 
     var f= document.getElementById('show_g').type="text"; 
 
     var g=document.getElementById('show_g').value=e; 
 
     d.value="Hide"; 
 

 
    } else{ 
 
     var f= document.getElementById('show_g').type="password"; 
 
     var g=document.getElementById('show_g').value=e; 
 
     d.value="show"; 
 
    }  
 
    } 
 
    </script> 
 
    </div>

.password { 
 
    margin-left: 50px; 
 
}

<table> 
 
    <tr> 
 
<th> <form action="/action_page.php" > 
 
    <!-- password for Wi-Fi login --> 
 
     <p class="text" class="arial" style="font-size:20px;">Password: <input style="font-size:20px" id="show_f" type="password" name="pass_f" maxlength='30' size='15' class="password" > 
 
    <input type="button" onclick="pass()" id="s1" value="show" style="height:25px; margin-left:5px;margin-top:3px;"> 
 
<input type="submit" value="connect" onclick="alert('Done!')" ></th> 
 
<!-- password for sql login --> 
 
    <th><p class="text" class="arial" style="font-size:20px;">Password: <input style="font-size:20px" id="show_g" type="password" name="pass_g" maxlength='30' size='15' class="password" > 
 
    <input type="button" onclick="pass2()" id="s2" value="show" style="height:25px; margin-left:5px;margin-top:3px;"> 
 
    \t  <input type="submit" value="connect" onclick="alert('Done!')" ></th> 
 

 
    </table> 
 
</form>

Answer 1

は慎重に見てください、両方が同じwidthとheight、以上です。ではない？

function pass(){ 
 
    var d=document.getElementById('s1'); 
 
    var e=document.getElementById('show_f').value; 
 
    var f=document.getElementById('show_f').type; 
 

 
    if(d.value=="show"){ 
 
     var f= document.getElementById('show_f').type="text"; 
 
     var g=document.getElementById('show_f').value=e; 
 
     d.value="Hide"; 
 

 
    } else{ 
 
     var f= document.getElementById('show_f').type="password"; 
 
     var g=document.getElementById('show_f').value=e; 
 
     d.value="show"; 
 
    }  
 
    } 
 
    </script> 
 
    <script> 
 
function pass2(){ 
 
    var d=document.getElementById('s2'); 
 
    var e=document.getElementById('show_g').value; 
 
    var f=document.getElementById('show_g').type; 
 

 
    if(d.value=="show"){ 
 
     var f= document.getElementById('show_g').type="text"; 
 
     var g=document.getElementById('show_g').value=e; 
 
     d.value="Hide"; 
 

 
    } else{ 
 
     var f= document.getElementById('show_g').type="password"; 
 
     var g=document.getElementById('show_g').value=e; 
 
     d.value="show"; 
 
    }  
 
    }

body { 
 
    margin: 0; 
 
} 
 

 
th { 
 
    background: red; 
 
}

<table> 
 
    <tr> 
 
<th> <form action="/action_page.php" > 
 
    <!-- password for Wi-Fi login --> 
 
     <p class="text" class="arial" style="font-size:20px;">Password: <input style="font-size:20px" id="show_f" type="password" name="pass_f" maxlength='30' size='15' class="password" > 
 
    <input type="button" onclick="pass()" id="s1" value="show" style="height:25px; margin-left:5px;margin-top:3px;"> 
 
<input type="submit" value="connect" onclick="alert('Done!')" ></th> 
 
<!-- password for sql login --> 
 
    <th><p class="text" class="arial" style="font-size:20px;">Password: <input style="font-size:20px" id="show_g" type="password" name="pass_g" maxlength='30' size='15' class="password" > 
 
    <input type="button" onclick="pass2()" id="s2" value="show" style="height:25px; margin-left:5px;margin-top:3px;"> 
 
    \t  <input type="submit" value="connect" onclick="alert('Done!')" ></th> 
 

 
    </table> 
 
</form>