title: How to make simple_form input field wider with CSS?
body: <p>We are trying to make simple_form input field wider. Here is the simple_form css posted on GitHub:</p>
  <pre><code>/* ----- SimpleForm Styles ----- */
  
  .simple_form div.input {
    margin-bottom: 10px;
    clear: both; /* Required for Webkit, but not for Gecko */
  }
  
  .simple_form label {
    float: left;
    width: 100px;
    text-align: right;
    margin: 2px 10px;
  }
  
  div.boolean, .simple_form input[type='submit'] {
    margin-left: 120px;
  }
  
  div.boolean label, label.collection_radio_buttons {
    float: none;
    margin: 0;
  }
  
  label.collection_radio_buttons {
    margin-right: 10px;
    vertical-align: -2px;
    margin-left: 2px;
  }
  
  .field_with_errors {
    background-color: #ff3333;
  }
  
  .simple_form .error {
    clear: left;
    color: black;
    display: block;
    margin-left: 120px;
  }
  
  .simple_form .hint {
    clear: left;
    margin-left: 120px;
    color: #555;
    display: block;
    font-style: italic;
  }
  
  input.radio {
    margin-right: 5px;
    vertical-align: -3px;
  }
  
  input.check_boxes {
    margin-left: 3px;
    vertical-align: -3px;
  }
  
  label.collection_check_boxes {
    float: none;
    margin: 0;
    vertical-align: -2px;
    margin-left: 2px;
  }
  
  Or in SASS format:
  
  /* ----- SimpleForm Styles ----- */
  
  .simple_form
    div.input
      margin-bottom: 10px
      clear: both
  
    label
      float: left
      width: 100px
      text-align: right
      margin: 2px 10px
  
    .error
      clear: left
      color: black
      display: block
      margin-left: 120px
  
    .hint
      clear: left
      margin-left: 120px
      color: #555
      display: block
      font-style: italic
  
  div.boolean, .simple_form input[type='submit']
    margin-left: 120px
  
  div.boolean label, label.collection_radio_buttons
    float: none
    margin: 0
  
  label.collection_radio_buttons
    margin-right: 10px
    vertical-align: -2px
    margin-left: 2px
  
  .field_with_errors
    background-color: #ff3333
  
  input.radio
    margin-right: 5px
    vertical-align: -3px
  
  input.check_boxes
    margin-left: 3px
    vertical-align: -3px
  
  label.collection_check_boxes
    float: none
    margin: 0
    vertical-align: -2px
    margin-left: 2px
  </code></pre>
  <p>We tried a few options in <code>div input {}</code> but there was no change with the field width. Not sure which part is for the layout of the input field. How can we make the input field wider by modified the CSS above?</p>