override type=password for input format

Question

this is my login widget. as you can see the username and password fields have different textboxes. i want them to only have the textbox which the "username" field has. problem is that the only thing that differs them is the input type. and i want the password field to not show the password. which the username field will.

so how do i solve this?

the code is this:

<div id="sidebar">
<div class="widget">
    <h3 class="widgettitle">Honestreviews.se</h3>
    <div class="textwidget">
        <form action="../login-exec.php" method="post">
        <ul id="login">
            <li>
                Username:<br>
                <input name="login" type="text" id="login" />
            </li>
            <li>
                Password:<br>
                <input name="password" type="password" id="password" />
            </li>
            <li>
                <input type="submit" value="Log in">
            </li>
            <li>
                <a href="register.php">Register</a>
            </li>
    </div>
</div>
<div class="widget_divide"></div>

Answer 1

The problem is your CSS. Most likely you're only targeting input elements whose type is "text" (although you may also be only targeting a name or id equal to "login"):

input[type="text"] {
    ...
}

You can rectify this by including input elements with a type of "password":

input[type="text"],
input[type="password"] {
    ...
}

Update: Based on the code you've provided your selector will need to be changed at line 1166. You'll also need to change your :focus selector at line 1189:

input[type="text"]:focus, input[type="password"]:focus, textarea:focus {
    ...
}

---

As a side note, semantically your code appears to be invalid. Your form elements are wrapped in li elements. What exactly is this a list of?