I have a form that has a bunch of cascading drop downs - something like Country->State->City->. Each subsequent drop down is populated based on what is selected on the preceding one.
What I am having trouble with is the positioning of the labels for these dropdowns. For ex., I want the word 'Country' written over the Country dropdown, the word 'State' over the State dropdown and so on. Unfortunately, anything I try doesn't seem to work. I have used every CSS property I thought would help - margin, position, padding etc., but nothing works.
The problem is when I resize the window the labels and the dropdowns are thrown out of whack and it becomes difficult to figure out just by looking which label belongs to which dropdown box. How do I fix this and make the position of the form elements independent of the size of the window?