表單元素底部的神祕空格

將表單放入div時，出於某種原因，表單底部總會有額外空間。我們如何擺脫這個空間？表單元素底部的神祕空格

在堆棧溢出代碼片段中，它實際上並不顯示空間，但它在其他任何地方都顯示空間。下面的代碼是全部。

div { 
 
    border: 1px solid blue; 
 
} 
 
form { 
 
    border: 1px solid red; 
 
}

<div> 
 
    <form> 
 
    Form 
 
    </form> 
 
</div>

2016-10-18 frosty

如果你不能在這裏複製它比我們不能幫助。我瘋狂的猜測是，你有一些邊緣定義在你的CSS的某處。您可以使用開發人員工具來檢查計算出的CSS並查看此邊距/填充來自 –

或者它可以是瀏覽器默認樣式的一部分。你可能想看看做一個CSS重置。 – Jacob

@ItayGal代碼全部在這裏。這只是一些帶有stackoverflow的代碼片段，可以糾正類似的情況，而不是在其他地方糾正。下面是帶有問題的頁面的鏈接：http：//chatwithibot.com/testx.php – frosty

你有一個margin-bottom: 16px。刪除它，它會解決你的問題。

2016-10-18 23:06:43

這必須是默認設置。因爲我沒有在HTML中定義它。 – frosty

您可以執行CSS重置並定義所有填充/邊距。 http://cssreset.com/what-is-a-css-reset/ –

您可以參考web開發工具（F12），你會看到一個form元素帶有一個margin-bottom: 1em，如browser's default stylesheet定義：

您可以通過定義重寫你自己的保證金規則：

form { margin-bottom: 0; }

2016-10-18 23:15:07

回答