jquery - 如何阻止花车和类(class)相互推倒？

Question

我只是想在我的网站上添加一个表单，但是当我添加它并使用上面的内容以使其适合框架时，它只是将所有内容向下推 Like so

我怎样才能让它全部在顶部对齐？我不明白为什么它被推到折叠的下半部分。

相关代码:

用css链接到jsfiddle:jsfiddle.net/sz2f64hd/

<div class="paging">

    {$page}

</div><!-- end paging -->

</div><!-- end body -->

<div class="site">
    <div class="section">
        <div class="serve-apply">
            <div class="body">
                <ul>
                    <volist name="index_mid4" id="item">
                        <li>
                            <h4><a href="{$item.url}">{$item.title}</a></h4>
                            {$item.content}
                            <i class="{$item.title_sub}"></i>
                        </li>
                    </volist>
                </ul>
            </div><!-- end body -->

            <div class="categories">

                <div class="head">

                    <h3>categories</h3>

                </div><!-- end head -->

                <div class="body">

                    <ul>

                        <volist name="category_list" id="item">

                            <li><a href="{$item.href}"><em>{$item['title']}</em>

                                    <i class="num"></i></a></li>

                        </volist>

                    </ul>

                </div><!-- end body -->

            </div><!-- end categories -->

            <div style="clear:both;" />

            <div class="side shake-an">
                <form action="{:U('Contact/quickAdd')}" class="frm_contact">
                    <input type="hidden" name="type" value="1" />
                    <h3>              Request <em>FREE</em> Trial</h3>
                    <div class="form-element">
                        <input type="text" class="form-text blue" name="customer_name" id="username" placeholder="Full Name" />
                        <label for="username" class="iconfont icon-user"></label>
                    </div><!-- end form-element -->
                    <div class="form-element">
                        <input type="text" class="form-text blue" name="email" id="username" placeholder="Email" />
                        <label for="username" class="iconfont icon-letter"></label>
                    </div><!-- end form-element -->
                    <div class="form-element">
                        <input type="text" class="form-text blue" name="city" id="username" placeholder="Preferred City" />
                        <label for="username" class="iconfont icon-map"></label>
                    </div><!-- end form-element -->
                    <div class="form-element last">
                        <button type="submit">Submit</button>
                    </div><!-- end form-element -->
                </form>
            </div><!-- end side -->
        </div><!-- end serve-apply -->
    </div><!-- end section -->

Answer 1

为什么你的正文在你的标题之前结束？你能告诉我们CSS吗？您是否尝试过按 f12 和 ctrl u 来分析代码？也许有一些隐藏的东西并使用 f12 搜索元素然后你可以检查并尝试 CSS

我找到了:

这里:

 .serve-apply > .body {

你做

height:450px;

删除那个

你那里有一些 div 刚刚关闭并且从未打开过