/*

 * Cross browser input field cursor position fix

 * 

 * answer to: http://stackoverflow.com/questions/10717294/text-field-cursor-issue-in-chrome

 * 

 * related issue: https://code.google.com/p/chromium/issues/detail?id=47284

 *

 * see how foundation does it: http://foundation.zurb.com/docs/components/forms.html

 *

 *

 * [1] overrides whatever value line-height property was given by any other selector

 *     note: make it "line-height: normal !important;" if necessary

 * [2] overrides whatever value "height" property was given by any other selector

 *     note: make it "height: auto !important;" if necessary

 *

 * [3] use the padding-top, padding-bottom to adjust the height of your input type text

 * [4] keep in mind that when changing the font-size value you will have to adjust the padding top and padding bottom if you want to keep the same height as previously

 */

.username input {

  background-color: #FFFFFF;

  border: 2px solid #DDDDDD;

  border-radius: 5px;

  color: #9E9E9E;

  height: auto;  /* [2] */

  line-height: normal;  /* [1] */

  margin: 15px 0px 0px 0px; 

  padding: 10px 5px 10px 5px;  /* [3] */

  width: 330px;

  font-size: 20px;  /* [4] */

}