Question

我正在构建一个菜单，向下滚动页面，例如Facebook的菜单，但我遇到了麻烦，表格似乎在div下面，我试着让它向左浮动但它仍然无效，我想要这样做，所以他们都排成一列..我做错了什么？

这是我的代码

<div id="topnav"> 


<div id="nav">
<a href="../index"><img src="/img/putlockermedia_logo.png" /></a>

<a href="../Shows"><input type="button" name="button" id="button" value="Shows" /></a>

<a href="../movies"><input type="button" name="button" id="button" value="movies" /></a>

<form action='/search.php' method='GET'>
<input id='searchbar' type='text' size='65' name='search' placeholder="search for movies & tv shows">
<input id='submit' type='submit' name='submit' value='Search' >
</form>

</div>


</div>

这里是完整的css :)

<style>
   #topnav{
    background-color: #999;
    height: 45px;
    width: 100%;
    position: fixed;
    left:0px;
    top: 0px;
}
    #nav{
        margin-left: 10px;

        }

   </style>

Answer 1

在表单中添加一个包装器div并将其向右浮动

<div id="topnav"> 


<div id="nav">
<a href="../index"><img src="/img/putlockermedia_logo.png" /></a>

<a href="../Shows"><input type="button" name="button" id="button" value="Shows" /></a>

<a href="../movies"><input type="button" name="button" id="button" value="movies" /></a>

    <div id="right">
<form action='/search.php' method='GET'>
<input id='searchbar' type='text' size='65' name='search' placeholder="search for movies & tv shows">
<input id='submit' type='submit' name='submit' value='Search' >
</form>
    </div>

</div>


</div>

<强> CSS

 <style>
 #topnav{
    background-color: #999;
    height: 45px;
    width: 100%;
    position: fixed;
    left:0px;
    top: 0px;
}
#nav{
   margin-left: 10px;
}
#right {
    float:right
}
</style>

Answer 2

是的，您必须在float:left; width:50%;

中使用div表单

检查fiddle link示例

如何将表格并排放入div

2 个答案: