html - 需要帮助衬一些按钮

Question

我不能让这些按钮保持在同一行，我认为这与 css 中的“清除”有关，因为如果我停用按钮的几乎所有 css 属性（使用 chrome 的检查元素），它们最终会排成一行。

这是页面： http: //framework.aluxian.com/login.php

Answer 1

只需覆盖and类中的clear属性，按钮将水平对齐。.button#loginbutton#registerbutton

#loginbutton,
#registerbutton {
    clear: none !important;
}

Answer 2

用 a 包裹它们<div>并清除它。只需解开clear按钮。这是我刚刚在 Firebug 中尝试过的代码：

<form action="login.php" method="post" id="loginform">
<!-- ... -->
<button style="clear: none;" class="button_colour round_all" id="loginbutton" onclick="document.forms['loginform'].submit();"><!-- ... --></button>
<button style="clear: none;" class="button_colour round_all" id="registerbutton" onclick="location.href='register.php'"><!-- ... --></button>
<!-- ... -->
</form>

onclick是的，我相信你不需要所有这些

Answer 3

这是因为main.css 样式表 中的clear: both;on #loginbutton（第 425 行）和（第 12 行）。button

删除两者的该属性或指定clear:none;on #loginbutton。这将取代该button属性。如果在 之后添加了另一个按钮#registerbutton，您也希望添加clear:both;到它。

Answer 4

#registerbutton {
    clear: none;
    display: block;
    float: left;
    margin: 10px 30px 55px;
}

#loginbutton {
    clear: none;
    display: block;
    float: left;
    margin: 10px 30px 55px;
}