Solved

Vertical Alignment Form/Label

Posted on 2010-08-15
2
743 Views
Last Modified: 2012-05-10
Hello

I am relatively new to CSS and I am struggling to solve this simple problem.

In the attached example, there is a form on the left. I can't get the labels to be vertically aligned with the inputs. The labels are all a bit above the baseline of the text in the inputs (Chrome and IE8). (cf image attached "mismatch")

I am sure it must be simple to fix but I tried all sort of combinations of vertical-aligns on the different div/labels without success.

Thanks in advance
Charles

index.html
style.css
mismatch.png
0
Comment
Question by:cm2187
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
2 Comments
 
LVL 16

Accepted Solution

by:
HagayMandel earned 125 total points
ID: 33441652
Add to the label span css the following:
padding-top:1px;

This will do it
0
 

Author Closing Comment

by:cm2187
ID: 33441987
actually 3px did the trick!
Thanks!
0

Featured Post

Announcing the Most Valuable Experts of 2016

MVEs are more concerned with the satisfaction of those they help than with the considerable points they can earn. They are the types of people you feel privileged to call colleagues. Join us in honoring this amazing group of Experts.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This is a PowerShell web interface I use to manage some task as a network administrator. Clicking an action button on the left frame will display a form in the middle frame to input some data in textboxes, process this data in PowerShell and display…
Not sure what the best email signature size is? Are you worried about email signature image size? Follow this best practice guide.
In this tutorial viewers will learn how to style a decorative dropcap for the first letter in a paragraph using CSS. In CSS, create a new paragraph class by typing "p.fancy": Then, to style only the first letter of the first sentence, include the ps…
Video by: Mark
This lesson goes over how to construct ordered and unordered lists and how to create hyperlinks.

733 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question