Placing icon in middle of HR

1

Hello all,

I’m having some trouble getting my glyph-icon to appear in the center of my divider.
I’ve got it centered before but it ends up overlapping over the divider, which doesn’t give the desired effect.
I’m trying to match the example in the persona portfolio project:

Below is the link to the code pen I’m working on:

http://codepen.io/drustin/pen/QdmKdN

Thanks!

2

You could set a margin-top to the glyphicon. Note that currently you are using glyphicon glyphicon-grain{ } but you need a dot in front of the classnames and without a space in between: .glyphicon.glyphicon-grain{ }.

And you can set a background-color equal to the background-color of the parent div.

1 Like
3

Thanks. Got it to work!

I didn’t know about the multiple class names syntax, definitely something to remember.

4

Unrelated: “freelance” is one word, no hyphen.
good luck!

1 Like
5