尝试将表单放在div的顶部

时间:2016-09-28 18:02:17

标签: html css css-position positioning

我在页面底部放了一个小盒子。我试图在div上方放置一个表单,但表单不断跳入bootstrap div。

这是html尝试 EDITTED: 我还希望表单中的行具有与面包屑相同的背景颜色,但它没有显示

<div style="padding:1px; background-color: #F2F2F2;">
    <form class="rightiest" method="post" action="/logout">
            <input class="btn btn-link" type="submit" value="Leave Group"/>
    </form>
</div>
 <div class="breadcrumb">
            <div class="wrap">
                <div class="container" style="text-align: center;font-size: 80%;">
                <strong> Please hold we will soon attend to you shortly</strong>



                </div>
            </div> 
</div>

这是控制表单的css

 form.rightiest {float:right; margin-top:0px; margin-bottom:7px;}

如上所述,表单与div重叠。请问如何将表格放在div上方。

2 个答案:

答案 0 :(得分:2)

你需要清理你的花车。

<?xml version="1.0"?>
<config>
    <modules>
        <mymodule>
            <version>1.0.0.0</version>
        </mymodule>
    </modules>

    <global>
        <resources>
            <update_myscript>
                <setup>
                    <module>mymodule</module>
                </setup>
            </update_myscript>
        </resources>
    </global>
</config>

答案 1 :(得分:1)

清除漂浮物。

     form.rightiest {float:right;
       margin-top:0px;
       margin-bottom:7px;}
    
    .breadcrumb {
       clear: both;
    }
<form class="rightiest" method="post" action="/logout">
            <input class="btn btn-link" type="submit" value="Leave Chat"/>
    </form>
     <div class="breadcrumb">
                <div class="wrap">
                    <div class="container" style="text-align: center;font-size: 80%;">
                    <strong> Please hold we will soon attend to you shortly</strong>
    
    
    
                    </div>
                </div> 
    </div>