首页 文章

Bootstrap CSS btn-block类不使用Rails进行提交按钮

提问于
浏览 次
2

我正在使用bootstrap-sass gem来设置我的Rails应用程序的样式，并且在使用新用户注册表单中的btn-block类处理提交按钮时遇到问题 .

以下是相关代码......

<%= link_to "Sign in with Facebook", user_omniauth_authorize_path(:facebook), class: "btn btn-primary btn-large btn-block" %> 

   <%= form_for(resource, :as => resource_name, :url => registration_path(resource_name)) do |f| %>
<%= devise_error_messages! %>

<%= f.email_field :email, placeholder: "Email" %>

    <% if f.object.password_required? %>

<%= f.password_field :password, placeholder: "Password" %>

<%= f.password_field :password_confirmation, placeholder: "Confirm Password" %>

<% end %>

<%= f.submit "Create Account", class: "btn btn-primary" %>

<% end %>

此代码使用bootstrap创建有效的提交按钮 . 但是，当我尝试将btn-block类添加到提交按钮时，它会与按钮样式混淆，并且不会给按钮增加宽度：100％样式，就像上面使用相同类设置样式的链接一样 .

css ruby-on-rails twitter-bootstrap

1 回答

  • 5

    在app / assets / stylesheets中创建一个名为style.css的新样式表

    确保使用语法 *= require_self 在application.css中明确要求使用此样式表

    所以在新的样式表app / assets / stylesheets / style.css中

    .btn.btn-primary {
  width: 100%; 
}

    如果这不起作用，您需要通过向表单添加ID来使选择器更具体 .

    回复于

相关问题