Modern Blogger Pro – Paragraph Spacing

Community Forums Forums Design Tips and Tricks Modern Blogger Pro – Paragraph Spacing

This topic is: not resolved

This topic contains 1 reply, has 2 voices, and was last updated by  Tonya 5 months, 2 weeks ago.

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
  • #113478

    Post count: 2

    I’m using Modern Blogger Pro theme. I’d like to reduce the spacing between paragraphs in posts. For example, when I press the [Enter] key, I want the following line to be directly under the previous line. I’ve done a search here in the forum but cannot find a solution.

    Also, I’ve added a custom header (but can’t recall how I did it…oops), anyway, I’d like to add the “subscribe via email” widget in the header. However, when I do, the widget is above my header real “wonky-like”. I don’t want that to be the case. I’ve removed it from the header area for now.

    Thanks in advance.

    Post count: 190


    For you first question, go to line 1294 in your style.css and reduce the amount of margin-bottom to achieve the spacing you want. For example, here is 10px of spacing between paragraphs:

    .entry-content ol,
    .entry-content p,
    .entry-content ul,
    .quote-caption {
    	margin-bottom: 10px;
    	margin-bottom: 1rem;

    For the second question, it looks like you added the image by using adding an action to ‘genesis_header’ instead of using ‘add_theme_support(‘custom_header’, array())’. With the image within the HTML and not set as a background image within the stylesheet, it causes the effect you are seeing. You can still deal with this as it is; however, you’ll need to use absolute positioning for the header widget-area to align it on the top right side.

    For example, you can make these changes and then adjust as needed:

    1. On line line 897:

    .site-header .wrap {
    	border-left: 1px solid #ddd;
    	border-right: 1px solid #ddd;
    	border-top: 1px solid #ddd;
    	border-top-left-radius: 20px;
    	border-top-right-radius: 20px;
    	padding: 30px 0;
    	padding: 3rem 0;
    	position: relative; /* This is new */

    2. Add this below:

    .site-header .widget-area {
    position: absolute;
    top: 0; /* Adjust to where you want it positioned */
    right: 0;


    Web developer, Software & Electrical Engineer, Bringing ideas to life is my art
    Find Me: | Twitter | GitHub | Customize without touching the child theme

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

You must be logged in to reply to this topic.