I can tell you why you're not getting the results you want, but with the question as it is now, I can't tell you how to get the results you do want.
position: relative
combined with left
and top
means that you're offsetting the element from where it would be in the browser's default layout. So you're still completely subject to how the browser lays the elements out relative to other elements, you're just moving them a bit based on that location.
If you want the labels to be aligned in some way with the inputs on the right, you need to put them both in some container (a div
, for instance) and if necessary adjust them within that container. (To do that, you probably have to make the container position: relative
without any left
or top
, so that it's the offset parent for its children.) By putting both within the same container, you ensure they're working from a similar basic position (the container).