CSS挑战,我可以不引入更多HTML吗？

Question

想象一下,我有任何带有文本的块或内联块.像段落或李或其他什么.如果该标记具有"分隔符"类,我希望它显示如下:

所有内容都居中(text-align:center;就足够了).这是一个棘手的部分:在居中内容的两侧,出现一条(垂直居中的)线.

下图说明了我的想法:

如果我必须引入更多HTML,那么就忘掉它 - 不感兴趣.

我是一个很长时间的CSS用户,但我无法想象这一个......其他人有个主意吗？尽管我喜欢它,但最好没有CSS3(因为工作......因为兼容性而无法使用新的东西)..

示例问题: <p class="separator">CENTRE ME</p>

Answer 1

这适用于Firefox:

.separator {
    text-align: center;
    height: 0.5em;
    border-bottom: 2px solid black;
    margin-bottom: 0.5em;
}
.separator:first-line {
    background-color: white;
}

JSFiddle演示