I am a newbie with CSS and i am trying to make a form which accepts firstname and lastname from a user with submit and reset button. I am using (http://css-tricks.com/examples/) 'Modal Login Form' as guide. Now, i am having hard time to put texts in the right place. Here is the screen shot of what i have: http://i36.tinypic.com/zy7rb8.jpg
I am having hard time aligning input box with the texts (firstname and lastname). Also i am trying to move 'Submit' and 'Reset' button little bit lower. When i try to increase my padding value, they increase input box size and button sizes. Can anyone tell me what am i doing wrong? Here is a screenshot of my HTML and CSS. HTML: http://i35.tinypic.com/30979fn.jpg CSS: http://i37.tinypic.com/2ujjgvo.jpg
P.S = Isn't padding suppose to move texts from top bottom right and left? What did it increases size in case of (input box and button).?
http://i36.tinypic.com/zy7rb8.jpg
I am having hard time aligning input box with the texts (firstname and lastname). Also i am trying to move 'Submit' and 'Reset' button little bit lower. When i try to increase my padding value, they increase input box size and button sizes. Can anyone tell me what am i doing wrong? Here is a screenshot of my HTML and CSS.
HTML: http://i35.tinypic.com/30979fn.jpg
CSS: http://i37.tinypic.com/2ujjgvo.jpg
P.S = Isn't padding suppose to move texts from top bottom right and left? What did it increases size in case of (input box and button).?
But have your tried to use margin-top: instead of padding-top:? I think it should work.
eg:
height: 16px;
font-size: 1.1em;
line-height: 1.6em;
em or px doesn't matter... this should make it align in the middle.
Put line height the same size the div its in.
Edit: Put them in a div and set the height and use the line-height
tell me if it works haven't been able to properly check it out