html - CSS/HTML - div 内的 div 未正确放置

Question

这是一个附加的图像，它为我的问题提供了一些背景。http://imgur.com/bPYmAIF

我无法在 div 中设置 div 样式。发生的情况是，当我双击该 div 中的文本时，您可以看到突出显示只突出显示了 div 的一半。

我想做的第二件事是确保所见即所得编辑器和标题 div 之间没有间距。

我正在使用 Django-ckeditor 作为文本编辑器。这是由 {{form}} 模板标签呈现的。（我显然在为这个应用程序使用 django web 框架）。

这是我的 HTML：

<div class="hero clearfix">
<div class="title">
    <h2>{{subsection_title}}</h2>
</div>
<br>
<div class="subsection">
    <div class="subsection_header ">
        <h4 style="text-align:left">Something interesting.</h4>
    </div>
    <div class="subsection_body">
    <p>lol</p>
    </div>
</div>          

这是我的 CSS：

 .subsection {
    width:1000px;
    margin:auto;
}
.subsection_header {
    border:1px solid #ccc;
    padding-left:20px;
    padding-right:20px;
    overflow:auto;
    margin:0px;
}
.subsection_body {
    margin:0px;
}

.hero {
    width:1000px;
    margin:auto;
    text-align:center;
}

.clearfix:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
    }

Answer 1

尝试这样的事情根据您的页面宽度如何，是的，请记住关闭结束标签

.

hero clearfix
{
   position:absolute;
   width:980px;
   margin-left:-490px;
   left:50%;
}

它可能会帮助你。