1 Vote Vote

Why Won't My Text Boxes Center?

Posted by topdog 839 days ago Questions| boxes text boxes text All
So I have two text boxes on one page, which I am using as log-in boxes. In google chrome the boxes are centered, but in firefox they are not; they sit just to the right of the background image (small white box with rounded corners) that i have centered. I want the text boxes to be centered on top of the background image, can someone help me with this? here is some of my CSS and HTML coding:
CODE
.loginboxdiv {
    /*for the white background image box*/
    margin-left:auto;
    margin-right:auto;
    height: 21px;
    width: 146px;
    background: url(Buttons/login_bg.gif) no-repeat bottom;
    text-align: center;
    }

.loginbox {
    /*the actual text box*/
    background: none;
    border: none;
    position: absolute;
    background: none;
    width: 134px;
    height: 15px;
    margin-top: 3px;
    margin-left: 6px;
    padding: 2px 7px 0px 7px;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 11px;
    text-align: center;
    z-index: 1;
    }


CODE
<!-- login text boxes -->
<h4>Username</h4>
<div class="loginboxdiv">
  <input class="loginbox" name="username" type="text"/>
</div>
<h4>Password</h4>
<div class="loginboxdiv">
  <input class="loginbox" name="password" type="password"/>
</div>
Discuss Bury


Who Voted for this Question