title: CSS Limited Border Size
body: <p>My goal is to have a border underneath and on the right side of each field to separate them and make it match the rest of my website. I've tried messing with the padding and margin but that screws up the centering. My goal is to have a border underneath and on the right side of each field to separate them and make it match the rest of my website</p>
  
  <p>PS. Im using ruby on rials and the devise gem for login pages with bootstrap installed if that affects anything</p>
  
  <pre><code>&lt;center&gt;
    &lt;div class = "jumbotron-main"&gt;
      &lt;center&gt;
        &lt;h2&gt;Log In&lt;/h2&gt;
  
        &lt;%= form_for(resource, as: resource_name, url: session_path(resource_name)) do |f| %&gt;
          &lt;div class="field" "box"&gt;
            &lt;%= f.label :email %&gt;&lt;br /&gt;
            &lt;%= f.email_field :email, autofocus: true, autocomplete: "email" %&gt;
          &lt;/div&gt;
  
          &lt;div class="field" "box"&gt;
            &lt;%= f.label :password %&gt;&lt;br /&gt;
            &lt;%= f.password_field :password, autocomplete: "off" %&gt;
          &lt;/div&gt;
  
          &lt;% if devise_mapping.rememberable? -%&gt;
            &lt;div class="field"&gt;
              &lt;%= f.check_box :remember_me %&gt;
              &lt;%= f.label :remember_me %&gt;
            &lt;/div&gt;
          &lt;% end -%&gt;
          &lt;div class="jumbotron jumbotron-bg-danger"&gt;
            &lt;div class="actions"&gt;
              &lt;%= f.submit "Log in" %&gt;
            &lt;/div&gt;
          &lt;% end %&gt;
  
          &lt;%= render "devise/shared/links" %&gt;
        &lt;/div&gt;
      &lt;/center&gt;
    &lt;/div&gt;
  &lt;/center&gt;
  
  &lt;style&gt;
    h2{
      margin-top: 4%;
      padding-top: 12px;
    }
  
    .field{
      border-bottom: solid 2px black;
    }
  
    .jumbotron-main{
      margin-top: 5%;
      background-color: #4F4F4F;
      width: 60%;
      color: black;
      height: 80% !important;
    }
  
    .jumbotron{
      margin-top: 10%;
      background-color: #EB5757;
      width: 400px;
      color: black;
      position: relative;
      padding-top: 5px;
      padding-left: 25px;
      padding-right: 25px;
      border-radius: 0px !important;
    }
  
    #user_username{
    background-color: #999999;
    border-style: solid;
    border-width: 1px;
    border-color: black;
  }
  
    #user_email{
    background-color: #999999;
    border-style: solid;
    border-width: 1px;
    border-color: black;
    margin-bottom: 20px;
  }
    #user_password{
    background-color: #999999;
    border-style: solid;
    border-width: 1px;
    border-color: black;
  }
  
    #user_password_confirmation{
    background-color: #999999;
    border-style: solid;
    border-width: 1px;
    border-color: black;
  }
  &lt;/style&gt;
  </code></pre>