• Resolved hmahraj

    (@hmahraj)


    I am using the SiteOrigin plugin with the Modality theme but the horizontal space between the features is too wide. Is there css I can use in the child theme to diminish it, please? Thank you.

    https://hersheylibrary.org/

Viewing 15 replies - 1 through 15 (of 26 total)
  • .sow-icon-image {font-size:140px !important}
    .sow-features-list .sow-features-feature {padding:10px}
    Thread Starter hmahraj

    (@hmahraj)

    I tried the css in the child theme but no changes were seen. What do you suggest? Is it the padding size? I did not leave in the css, this time.

    My objective is to bring closer all that is at the level of PATRON SERVICES with the image widgets below it, and READ, LEARN, JOIN and their image widgets below that; to make the home page more compact & less scrolling down.

    I really appreciate your help, lorro.

    linux4me2

    (@linux4me2)

    How about this:

    #pg-1004-0, #pg-1004-1, #pg-1004-2, #pg-1004-3, #pl-1004 .panel-grid-cell .so-panel {
      margin-bottom: 0 !important;
    }
    
    .panel-widget-style h1 {
      margin-bottom: 0;
    }

    Thread Starter hmahraj

    (@hmahraj)

    That really helped! AMAZING. Thank you.

    Everything from READ, LEARN, JOIN down to STAY CONNECTED WITH US ON SOCIAL MEDIA is very even.

    I know this is picky, but I see a slight disparity in space. Could the space between the image widgets just below PATRON SERVICES be a bit closer to make it even, or is best left as is?

    linux4me2

    (@linux4me2)

    That’s not picky at all.

    It looks like there is an empty set of <p></p> tags in the section below Patron Services that is adding the extra space. If you can’t find that extra paragraph to delete it, I think you can fix it with this to make it even:

    .siteorigin-widget-tinymce.textwidget p {
      display: none;
    }

    Thread Starter hmahraj

    (@hmahraj)

    The css worked in as much the space below PATRON SERVICES was reduced and even with the image widgets and all below it; but I lost all the content of the SiteOrigin Editor widget on the right, from “Annual Book Sale” down to “Staff Picks”. Only “Popular Searches:” remained.

    So close to the solution! We are almost there.

    I cannot see anything on the page in the back end that is extra and shouldn’t be there. The page is made entirely of SiteOrigin widgets. Thanks for persevering with me on this, linux4me2!

    Thread Starter hmahraj

    (@hmahraj)

    How do you see the empty set of <p></p> tags in the section below Patron Services? I can’t see it.

    linux4me2

    (@linux4me2)

    The .siteorigin-widget-tinymce.textwidget p must be too general; it’s including the stuff in the sidebar. I’ll take a look and see if I can narrow it down more.

    I’m using Firefox to look at the source code and CSS: Shift + Ctrl + C, or Tools -> Webdeveloper -> Inspector.

    linux4me2

    (@linux4me2)

    Do you by any chance have an extra line at the bottom of the text widget, and/or have “automatically add paragraphs” checked for it?

    linux4me2

    (@linux4me2)

    The extra <p></p> is right after the <h1>Patron Services</h1> tags in the source.

    Thread Starter hmahraj

    (@hmahraj)

    Yes. I looked at the widget for PATRON SERVICES. YES, he box is checked for automaticaly add paragraphs.

    Thread Starter hmahraj

    (@hmahraj)

    Like this? <p>&nbsp;</p> Is see it in the source, now.
    I am using Chrome.

    linux4me2

    (@linux4me2)

    Yes, that’s what I’m seeing. The &nbsp; is a non-breaking space, so it’s just an empty paragraph taking up vertical space. Ideally, you’d find it and remove it in the widget instead of adding CSS to deal with it. You can try unchecking “automatically add paragraphs” and see if that solves it. I’ll peak at the CSS once more and see if I can find a more-specific declaration that will work and not hide your sidebar content.

    linux4me2

    (@linux4me2)

    Okay, if you can’t find and remove the extra paragraph/extra line in the Patron Services widget, try this CSS:

    #panel-1004-1-0-0 .siteorigin-widget-tinymce.textwidget p {
      display: none;
    }

    Thread Starter hmahraj

    (@hmahraj)

    I unchecked that box, and if my eyes are not deceiving me, the space did shrink a bit. I shall go ahead and add the css so see the effect.

Viewing 15 replies - 1 through 15 (of 26 total)
  • The topic ‘How to reduce horizontal white space’ is closed to new replies.