Hi,
I 've got a problem concerning the text alignment of my three input tags.
In IE6, the "login" and "ok" words are completely aligned on the bottom
border. Yet my padding is : 0px 0px 0px 1px;
Changing the line-height does not improve anything.
In FIREFOX 0.9.3, the text of the first input tag is fine. The asterisks of
the input type password are too high in text field. And finally, the text of
the third input tag is on the bottom border of the text field.
Pls find below the html and css codes. Any idea is kindly accepted. Thks.
Léa
HTML
<div id="ctnr">
<div id="header">...</div>
<div id="container">
<div id="memberArea">
<form action="php/areaMember.php" method="post">
<input type="text" name="login" value="login" size=15 maxlength=30 />
<input type="password" name="password" value="password" size=15 maxlength=30
/>
<input type="submit" name="submit" value="ok" />
</form>
</div>
....
</div>
</div>
CSS
body {
margin: 0px;
padding: 0px;
font-size: 12px;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
color: Black;
background-color: White;
text-align:center; /*IE5/Win incorrectly applies the CSS "text-align"
attribute to block-level elements. Declaring "text-align:center" for the
containing block-level element (often the BODY element) horizontally centers
the box in IE5/Win */
}
/* Page centering */
div#ctnr {
width : 750px;
margin-top: 0px;
margin-left: auto;
margin-right: auto;
padding: 0px;
text-align: left
}
....
div#memberArea {
background-image: url(images/areaMember2.gif);
height: 20px;
width: 750px;
}
form {
float: right;
padding: 0px;
margin: 0px;
width: 250px;
}
input {
margin: 1px 3px 1px 0px;
padding: 0px 0px 0px 1px;
height: 14px;
border:1px solid gray;
color: #666666;
font-size: 10px;
vertical-align: middle;
}
....
