Question

我有以下代码：

<div class="skinny_wrapper wrapper_padding">
  <%= form_for @contact do |f| %>
  <%= f.label :name %> <br>
  <%= f.text_field :name, required: true %>

  <br>

  <%= f.label :email %> <br>
  <%= f.email_field :email, required: true %>

  <br>

  <%= f.label :message %> <br>
  <%= f.text_area :message, as: :text %>

  <div class="hidden">
    <%= f.label :nickname %> <br>
    <%= f.text_field :nickname, hint: "leave this field blank" %>
  </div>

  <%= f.submit "Send Message", class: "button" %>

  <% end %>
</div>

电子邮件输入字段的格式与其他字段不同，并且显示如下：

http://repo1.maven.org/maven2/com/google/code/gson/gson/2.2.4/gson-2.2.4.jar

我不确定为什么会这样。

“ skinny_wrapper”和“ wrapper_padding”类包含以下CSS：

.skinny_wrapper {
width: 80%;
max-width: 760px;
margin: 0 auto;
}

.wrapper_padding {
padding: 1.8rem 0;
}

Answer 1

.skinny_wrapper{
    position:relative;
   }
 .skinny_wrapper input[type="text"],input[type="email"],.skinny_wrapper textarea{
    width: 80%;
    max-width: 760px;
    margin: 0 auto;
    display:block; 
    }

    .wrapper_padding input[type="text"],input[type="email"],.wrapper_padding textarea{
    padding: 1.8rem 0; 
    }

尝试一下，让我知道你得到了什么！

Rails操作视图表单助手“ f.email_field”在同一页面上未显示与其他助手相同的格式

1 个答案: