按鈕中的文本按下FF

我在http://www.myprivacyaudit.com/上的「檢查」按鈕有問題。在Firefox中，它被推下並部分隱藏。你有沒有人知道爲什麼？我已經花了幾個小時，並找不到解決方案。順便說一句。我使用Twitter的引導按鈕中的文本按下FF

HTML：

<div class="row"> 
    <div class="span6 offset3"> 
    <div id="enter-username"> 
     <div id="tweet_form"> 
     <form accept-charset="UTF-8" action="/confirm" class="form" method="post"> 
      <span class="at">@</span> <input class="" id="twitter_account" name="twitter_account" type="text" /> 
      <br/> 
      <input id="twitter_account_submit" name="commit" type="submit" value="Check" /> 
     </form> 
     </div> 
    </div> 
    </div> 
</div>

CSS：

input#twitter_account_submit { 
    border: 5px solid black; 
    background-color: #ff5255; 
    font-family: 'Anton', sans-serif; 
    font-size: 30px; 
    height: 40px; 
    margin-left: 50px; 
    }

來源

2012-08-25 misza222

你能在這裏包括有問題的代碼嗎？ –

試圖改變這一點：

<input id="twitter_account_submit" name="commit" type="submit" value="Check">

這樣：

<button id="twitter_account_submit" name="commit" type="submit">Check</button>

而在你的CSS文件，更改此：

input#twitter_account_submit

這樣：

#twitter_account_submit

來源

2012-08-25 17:22:34 snuffn

輝煌，工作，非常感謝你。你怎麼知道這是原因？ – misza222

-1

檢查按鈕是一個內聯元素。你已經聲明瞭40px的高度，但是你不能控制內聯元素的高度。

此外，在您的樣式表的早些時候，您聲明瞭正在傳遞到按鈕的18px的行高度。

完全刪除你的身高聲明，並應用行高（嘗試行高：120％），這對我有效。

來源

2012-08-25 17:29:20 dzny

儘管在不同的瀏覽器渲染它們的方式之間有一些區別導致了這種假設，但是'INPUT'，'BUTTON'和'SELECT'元素不是內聯元素。較新的瀏覽器傾向於在其基本CSS中應用「display：inline-block;」，這允許修改高度。老的瀏覽器確實傾向於將這些元素視爲「display：inline;」，但在那些使用「line-height」設置高度的瀏覽器中（我在想IE6/7）並不可靠。 – thirdender

按鈕中的文本按下FF

回答

相關問題