我有一個簡單的提交按鈕。我想將它與中心對齊。這裏是我的代碼:對齊按鈕到中心
<input type="submit" name="btnSubmit" value="Submit" onClick="Submit" align="center">
但是,它不起作用。什麼是最好/最簡單的方法來做到這一點?
我有一個簡單的提交按鈕。我想將它與中心對齊。這裏是我的代碼:對齊按鈕到中心
<input type="submit" name="btnSubmit" value="Submit" onClick="Submit" align="center">
但是,它不起作用。什麼是最好/最簡單的方法來做到這一點?
你應該使用這樣的事情:
<div style="text-align:center">
<input type="submit" />
</div>
或者你可以使用這樣的事情。通過給元件的寬度和指定auto
的左,右邊界的元件將中心本身在它的父。
<input type="submit" style="width: 300px; margin: 0 auto;" />
margin: 50%;
您可以根據需要調整的百分比。它似乎在響應式電子郵件中爲我工作。
這裏是我工作:
<input type="submit" style="margin-left: 50%">
如果只添加保證金,不左邊部分,將中心提交按鈕到您的整個頁面的中間,使得它很難找到和渲染你的表格對於沒有耐心尋找提交按鈕的人來說是不完整的。頁邊空白將它置於同一行中,所以它不會比你想要的更靠近頁面。 您還可以使用像素而不是百分比,如果你只是想縮進提交按鈕一點,而不是橫跨半個頁面的所有道路。
添加寬度:100px,保證金:50%。 現在該按鈕的左側設置爲中心。
最後添加按鈕的寬度的一半在我們的例子50像素。
按鈕的中間是在中心。
<input type='submit' style='width:100px;margin:0 50%;position:relative;left:-50px;'>
對我來說,它使用flexbox,這在我看來是最乾淨的解決方案。
添加CSS類的父DIV /元素周圍:
.parent {
display: flex;
}
和按鈕使用:
.button {
justify-content: center;
}
你應該使用父DIV,否則按鈕不會'知道'頁面/元素的中間是什麼。
如果不工作,請嘗試:
#wrapper {
display:flex;
justify-content: center;
}
這是不完全正確。您發佈了兩種完成任務的不同方式。其中一個是正確的,另一個是錯的。你可以在父對象上使用'text-align:center',這是正確的。但他可能不希望父母的一切都以中心爲中心。僅僅爲了居中而添加它會是浪費的標記。爲此解決方案添加'margin:0 auto;'是不必要的。這是一個單獨的方法。它需要提交按鈕來定義一個「寬度」。您應該更正您當前的答案,並可能發佈第二個解決方案。 – mrtsherman 2012-04-02 06:48:22