Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
  • #12763


    How do I reduce the spacing between elements when using a Horizontal Ruler element?

    An example is creating a template with following elements:

    – Post/Page Content

    – Horizontal Ruler

    – Heading + Subtitle

    I would like to reduce the space either side of the Horizontal Ruler.

    I am using the Angular theme.


    Hi dmckern,

    Add this to your custom.css or Quick CSS.

    .hr {
    padding: 30px 0;

    To explain, 30px is applied to both the top and bottom padding. You’ll need to change the value as you see fit.




    If just want to change top padding ?


    Hey dnamedical,

    Try adding the following CSS to your Quick CSS (located under the Styling Tab in the theme options) or the custom.css file in the css folder of your theme files:

    .hr {
    padding-top: 10px;





    Thanks for the fast responce,

    .hr {

    padding-top: 10px;


    effects both top and bottom padding. I´m using Propulsion Theme.

    Actually my problem was that the frontpages content, was not pulled from a “post”, now i can see that if content comes from a post, the HR ruler padding acts different, with same padding up and below. Otherwise the padding is really very huge below. So thats solved, i will just use content from post.

    WP, 3.4. made some errors on page (im using the latest version of Propulsion), was it this week a update of theme was sceduled ?

    Now that we are at it, i might just try and get your support to change a couple of settings, and the theme would be just perfect for me.:

    1. Changing the color of sites main menu it´sfine if also impact the drop down menu, and if also affect font colour in text widget.

    2. The widget title a little larger and “case sensitive”

    3. Footer tilte a little larger and “case sensitive”, content in footer also slightly larger fonts

    I hope my needs are understandable

    Thank you very much for your support



    Hi Jesper,

    That is strange that it effects anything other than the padding on the top. By its nature, padding-top can only effect the top part of the element its on. I’m glad that you were able to find a fix for your liking however.

    For the other questions:

    1. I don’t know what you mean for this one. If you can explain this a little better we might be able to help.

    2. Try adding the following CSS to your Quick CSS (located under the Styling Tab in the theme options) or the custom.css file in the css folder of your theme files:

    font-size: 13px;
    text-transform: none;

    3. The above fix should effect this too.




    1., there are two main menu titles “DNA TEST” and “KONTAKT OS”, how to change the font color ?

    another issue, when adding a product to cart, and view cart this error shows: Warning: strpos() [function.strpos]: Empty delimiter in /home/dnamedic/public_html/wp-content/plugins/woocommerce/classes/shipping/class-wc-shipping.php on line 204, check out the product section on front page, its out of focus, especially in chrome browser it most effected.

    Those issuse came when updated to WP 3.4


    For the first one, you can change the color by targeting the dynamic post title:

    h1.dynamic-post-title {
    color: #333333;

    It looks like there is an error with WooCommerce. Hopefully they will have a fix up soon available in an update.

    I’m not sure what you mean by out of focus. I’m not sure how you have those elements set up, but it looks like there is some layout issues going on with the product slider.




    Hi Devin

    Im actually only trying to have changed the color af menu tiltles on frontpage, the code provided did not change anything there.




    Hi dnamedical,

    Try to add the following code in your Quick CSS or custom.css:

    #menu-main-menu li a {
    color: #333;

    If it doesn’t work. Try to use this one instead:

    #menu-main-menu li a {
    color: #333 !important;

    Hope this helps. :)



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

The topic ‘Reduce the spacing between elements – Horizontal Ruler’ is closed to new replies.