html - 表单标签弄乱了我的网站

Question

我在我的网站上工作，当我添加表单标签时，它弄乱了我的导航栏。我试过给它 0 填充 0 边距，但似乎没有帮助。

http://pyxel.atspace.tv导航栏应该是这样的，但是http://pyxel.atspace.tv/contact.php这就是它的结局。

这是网站中间的表单。里面什么都没有:

<div class="middlecontents">
    <form>
    </form>
</div>

这是我所有标签的 css(我没有表单本身的 css):

* {
    top: 0px;
    right: 0px;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    -webkit-user-select: none;  
    -moz-user-select: none;    
    -ms-user-select: none;      
    user-select: none;
}

这是我的导航栏(没什么特别的，就是很多 div):

<div id="navbar">
    <!-- Orange bar in Navbar-->
    <div id="topbar"></div>
    <div id="buttons">
        <!--Home button-->
        <a href="/">
            <p class="button">Home</p>
        </a>
        <!--Divider-->
        <div class="divider"></div>
        <!--About us button-->
        <a href="about.php"><p class="dbutton">About<br>Us</p></a>
        <!--Divider-->
        <div class="divider"></div>
        <!--Forums Button-->
        <a href="forums.php">
            <p class="button">Forums</p>
        </a>
        <!--Divider-->
        <div class="divider"></div>
        <!--Contacct Button-->
        <a href="contact.php">
            <p class="button">Contact</p>
        </a>
        <!--Divider-->
        <div class="divider"></div>
        <!--Information Button-->
        <a href="info.php">
            <p class="dbutton">Donate/Vote<br>Information</p>
        </a>
        <!--Divider-->
        <div class="divider"></div>
        <!--Donate Button-->
        <a href="donate.php">
            <p class="button">Donate</p>
        </a>
        <!--Divider-->
        <div class="divider"></div>
        <!--Vote Button-->
        <a href="vote.php">
            <p class="button">Vote</p>
        </a>
        <!--Divider-->
    </div>
    <div id="profile">
    </div>
</div>
<div id="topborder"></div>

如果它像在主页上一样显示导航栏，请刷新几次。它的工作原理很奇怪。

Answer 1

不确定为什么会这样，但你可以用 L 修复

#buttons {
  float: left;
  height: 61px;
  width: 100%;
}