title: CSS cross-browser positioning of form elements
body: <p>Has anyone come up with a strategy for styling form elements that works cross-browser? For me, <code>textfields</code> and <code>textareas</code> are usually not a problem, but <code>checkboxes</code>, <code>radio buttons</code>, and <code>selects</code> (dropdowns) create havoc.</p>
  
  <p>I don't need these things to look identical in the various browsers. But I'd like to be able to line them up predictably. I'd like to be able to put a <code>checkbox</code> below a <code>textfield</code> and have it line up with the left edge of the <code>textfield</code>. If this works in <code>Safari</code>, then it doesn't in <code>Firefox</code>: there the <code>checkbox</code> ends up below the center of the <code>textfield</code>.  Sometimes the vertical placement can differ by <code>48px</code> or more.</p>
  
  <p>I have Opera on my Apple <code>iMac</code>, on my PC desktop computer with <code>Windows XP Pro</code>, and on a PC laptop with <code>Windows 7</code> (in each case, the newest version of <code>Opera</code>). In order to position the <code>checkboxes</code> I had to individually target each of these machines.</p>
  
  <p><code>Select</code> fields (dropdowns) give me the same headaches. Often they're okay in some browsers, but on others they end up on top of a <code>checkbox</code> or <code>textfield</code>, or <code>60px</code> to the left or right.</p>
  
  <p>The one thing I really haven't tried is <code>CSS</code> reset, since Eric Meyer has said he doesn't use it for forms. Has anyone else tried it with success? Is there any reliable way to build a form with generally uniform styling? I don't even mind identifying the user agent and delivering specific <code>CSS</code>. But when the same browsers render the elements differently on computers of different screen size, the problem becomes overwhelming.</p>
  
  <p>Yet clearly there's an answer, because a lot of forms on the web seem to work cross-browser. Can anyone give me a hand?</p>
  
  <p>Thanks.</p>
  
  <p>Mark</p>