Section divider - hr.section.divider CSS modification has no effect

Dear Admins!

I’d like to bring back the hearts in the separator lines (hr) – actually not the heart but an other Fantastic Awesome Font.
I had it at the beginning and I don’t know where is it now, what kind of settings or plugins made it to disappear.

I’ve even tried the CSS Editor with the

hr.section-divider::after {
content: “\f004”;
font-family: FontAwesome;
}

lines but it and onther tries have no effect. The only effect I can achieve with is modding the simple “hr” in the CSS Editor, I mean it has the only result on the section divider. I’ve inspected the original demo site with F12 as well to get some info, but no results. There on your demo site I found the hr.section-divider::after and ahs effect if I change the datas.

My aim is to put either custom Font Awesomes or .jpg-s there according to my friend’s need.

Please help me!

Site: http://dekan.51.profitarhely.hu/

Edit: It is weird. As soon I posted this, the heart appeared at the top of the site. F5 – BANG – DISAPPEARED!!! WHAT? ?

Could you give me some advice? Thank you!

Hi @eteroxee,

I hope you are well today and thank you for your question.

The heart icon only displays on the horizontal lines created by hr tags which are assigned “section-divider” class.

If you want to display heart icon on all hr lines then you can try achieving this by adding the following CSS code in the Custom CSS option of your theme on the below path.

Admin Area -> Appearance -> Unite Options -> Other -> Custom CSS

hr {
    height: 1px;
    background: #EEE;
    position: relative;
    overflow: visible;
    z-index: 100;

}
hr:after {
    z-index: 10000;
    content: "\f004";
    font-family: FontAwesome;
    color: #54397E;
    position: absolute;
    top: -23px;
    left: 50%;
    right: 50%;
    width: 40px;
    height: 30px;
    margin-left: -20px;
    font-size: 30px;
}

Best Regards,
Movin

Dear Movin,

Thank you, but…

THERE THEY ARE!!! I’ve copypasted the code and had no result, so I was sad. Then I’ve inspected the code and reailzed that somehow this line become: “content: & quot;” so, the “\f004” disappeared and changed to a weird one! :smiley: So I corrected it and… H E A R T S EVERYWHERE!!!

Thank you Movin, now I am well!

You are most welcome here :slight_smile: