Submit_tag 按钮不服从 CSS 宽度答案

【问题标题】：Submit_tag button won't obey CSS widthSubmit_tag 按钮不服从 CSS 宽度
【发布时间】：2015-03-26 21:01:32
【问题描述】：

我有以下表格：

<%= form_tag users_path, :method => :get do %>
  <%= #... %>
  <%= submit_tag("", class:"submit-button") %>
<% end %>

我可以使用 CSS3 以任何我想要的方式设置 submit_tag 按钮的样式，除了它的宽度。无论我做什么，它都保持在 16px 宽度。任何人都知道为什么会这样，或者我可以如何调试它？

css

@import "bootstrap";

.submit-button {width:100px;height:100px;}

【问题讨论】：

添加display: inline-block; 将尊重width 和height 属性。您使用的是哪个浏览器？浏览器应该内置 DOM 检查器。试试看。例如。 Ctrl+Shift+I 在 Chrome 中带来开发者工具。
添加了display: inline-block;，但它仍然不会从 16px 宽度移动。不过，我可以设计高度。我可以在检查器内部做什么来调试它？
尝试width: 100px !important; 进行调试，看看它是否被覆盖。
啊，现在可以了！那么它在哪里被覆盖？我知道我没有设置任何其他 css。
用 firebug 或 chrome 检查器检查，看看哪个旧样式覆盖了您的新样式。

【解决方案1】：

你可以试试：

width: 100px !important;

但不推荐。我确信其他一些 css 会覆盖您当前的 css 样式。所以检查它并将你的按钮样式放在那个样式之后。

【讨论】：