Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
  • #564116


    I’ve got an issue with hr’s on my site.

    I’m running WordPress Version 4.4.1 and Enfold: 3.4.7

    I’ve tried creating a custom hr using the following settings:

    But all I get is a hr with no icon. See;

    I have removed all of my custom CSS but the issue remains. I get an hr but no icon.

    Then, on another hr issue. I want my own icon in the middle so I set up some custom code as per this fiddle:

    But in the browser the hr is grey and I can’t change this. I’ve tried adding color: #949300!important; to the CSS but nothing works. You can see the output at: below the 3 columns.

    I’ve made a quick screencast video to illustrate:

    What am I doing wrong. Why isn’t the icon showing in the enfold custom he and why can’t I change the colour of the hr?


    Hey DigitalEssence,

    Please send us a temporary admin login so that we can have a closer look. You can post the details in the Private Content section of your reply.




    I’ve added a user and included the details in the private reply.



    Please add following code to Quick CSS in Enfold theme options under General Styling tab .hr-inner {
        width: 50%!important;



    Hi Yigit,

    I’ve added that code and refreshed but no change.



    That does work. I can now see the icon.

    Any ideas on my second issue where I’ve got the following code block:

    <div class='hr_icon'>
      <hr color="#949300">
      <img src=''>

    And the following css

    .hr_icon {text-align: center; color: #949300!important; width: 100%;}
    .hr_icon img { position: relative; top: -70px; }


    Please turn on custom CSS field for ALB elements – and give your code block a custom class and then add following code to Quick CSS

    .your-custom-class hr {
        border-color: #949309;


    • This reply was modified 4 years, 4 months ago by  Yigit.


    1) OMG I didn’t know about that custom class code. That is so going to make my life easier. Up until now I have always dropped everything into a colour section then had to use css to hide borders and make it look “normal”. This is so going to speed my development up.

    Big smiles!

    2) Thank you that has fixed the hr issue.

    3) I store all my snippets on my Gist account: if anyone else finds anything useful there.



    You are welcome, we are always happy to help :)
    Thank you for sharing your snippets :) Let us know if you have any other questions or issues


Viewing 9 posts - 1 through 9 (of 9 total)

The topic ‘Custom hr doesn't show icon’ is closed to new replies.