Как нарисовать горизонтальную линию на правой стороне метки по центру - PullRequest
2 голосов
/ 29 февраля 2012

Могу ли я сделать такую ​​вещь с помощью CSS?

У меня была идея с оформлением текста, но это всегда проблема с длиной текста. Могу ли я сделать что-то подобное только с одним элементом HTML?

http://i.stack.imgur.com/G5NXA.png

Ответы [ 4 ]

3 голосов
/ 29 февраля 2012

Этот ответ относится к вашему вопросу:

HTML

<div id="line"><span>TEXT</span></div>​

CSS

#line{
    border-bottom: 1px black dotted;
    overflow:visible;
    height:9px;        
    margin: 5px 0 10px 0;
}
#line span{
    background-color: white;        
    padding: 0 5px;
}​

jsFiddle demo: http://jsfiddle.net/EX3qa/2/

1 голос
/ 29 февраля 2012

Это не слишком красиво, но http://jsfiddle.net/csswizardry/34bBd/

Использует один элемент, не использует жестко запрограммированные числа, идеально подходит для повторного использования.

1 голос
/ 29 февраля 2012

Смотрите здесь:
http://jsfiddle.net/LRSuJ/1/

0 голосов
/ 15 ноября 2012

Я думаю, вы должны использовать fieldset с тегом легенды . и удалите те строки, которые вам могут не понадобиться. как слева направо и кнопка. (или сделать цвет белым или прозрачным)

...