html - 扩展 :after inline-block for the rest of the element

Question

我有一个 h3 标签，带有 :before (一个小方 block )和 :after 我想要一条延伸到其余宽度。

:before 和 :after 都设置为 display:inline-block ，这样我就可以设置宽度和高度.

为 :after 设置 width:100% 换行

看看这里

http://jsfiddle.net/CTd2w/81/

附注我对 JavaScript 解决方案很满意

Answer 1

这是一个不使用 :before 和 :after 的解决方案。请参阅:http://jsfiddle.net/Wexcode/CTd2w/83/

HTML:

<h3><span>Aktuell</span></h3>

CSS:

h3 {
    border: 0px solid #860d0f;
    border-bottom-width: 1px;
    height: 13px;
}
span {
    background: #fff url(images/logo_square.jpg) 0 50%;
    font-size: 14px;
    color: #860d0f;
    text-transform: uppercase;
    padding: 0 5px 0 14px;
}