Question

我正在使用site并且有一个Google CSE输入可以正常工作，但输入字段文本在Firefox中无法正常显示。它在Chrome和Safari中看起来很不错。但在FF中绝对是微观的。输入字段位于页面的右上角。

以下是代码：

<form action="http://dev.rouviere.com/search-results/" id="cse-search-box">
  <div>
    <label for="q">search</label>
    <input type="hidden" name="cx" value="017425724926122041548:nrhzbynfo9u" />
    <input type="hidden" name="cof" value="FORID:9" />
    <input type="hidden" name="ie" value="UTF-8" />
    <input type="text" name="q" id="q" autocomplete="on" size="31" style="font-size: 13px; color:#797979;" />
  </div>
</form>

这是CSS：

form input#q { 
    height: 20px !important;
    font-size: 13px !important; 
    color: #797979; 
    float: right;
    margin-top: 5px;
}

关于内联样式的注释。因为Google应用了一些样式并且我的CSS样式没有效果，所以我也添加了内联样式。

Answer 1

它没有呈现微观，它被填充/输入高度隐藏。

如果您更改以下规则，则应该有效：

input#q {
  height: 25px !important;
  ...
}

form input {
  padding: 5px 2% !important;
  ...
}

虽然我建议重新调整你的css，以避免在任何地方使用！important更重要，并且更加具体地说明你在规则中要选择的内容。

为什么Firefox中的输入文本是微观的？

1 个答案: