I used to make custom underlines for websites via illustrator. Specifically when I didn’t want a full width solution. The following is an example of how to make it happen using only html/css.
To produce the follow type effect:
Add HTML element:
|
1 |
<i class="thin-seperator"></i> |
CSS needed:
|
1 2 3 4 5 6 7 8 9 |
.thin-seperator { content: ''; display: block; height: 2px; width: 80px; position: relative; top: -22px; background-color: orange; } |