CSS - 在标题/ HTML周围重复样式边框

Question

我的html部分有以下代码

只有第一个标题创建一个边框，其余的都在这个地方，下面是它应该是什么样子的两张照片，以及它看起来像什么......

！[在此处输入图片说明] [1]

！[在此输入图片说明] [2]

有什么想法吗？谢谢！

Answer 1

代码有点乱。但如果这是你想要的：http://jsfiddle.net/96z7U/3/ 这些是变化：

<h1 class="titleBorder">Module Details</h1>

没有上课。

#moduleDetails {
    border-style: solid;
    /*border-width: 1px;*/
    padding: 5px;
}

我不确定你是否想要那个边界。

和

.titleBorder {
    padding-top: 10px;
    border-style: solid;
    border-width: 1px;
    margin:0 auto;
    float:left;
    width:100%;
}

向左添加浮动，向左添加宽度<％p

Answer 2

问题似乎与标题下方的内容具有导致问题的样式float:left这一事实有关。尝试在每个标题之前使用类'titleBorder'添加以下代码：

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