HighDots Forums  

Text alignment in input tags

Cascading Style Sheets Layout/presentation on the WWW (comp.infosystems.www.authoring.stylesheets)


Discuss Text alignment in input tags in the Cascading Style Sheets forum.



Reply
 
Thread Tools Display Modes
  #1  
Old   
Lea
 
Posts: n/a

Default Text alignment in input tags - 08-26-2004 , 07:31 AM






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;
}
....






Reply With Quote
Reply




Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off



Powered by vBulletin Version 3.5.4
Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.