Spacing issues

  • Resolved mindylll

    (@mindylll)


    2 years, 10 months ago

    We have several questions about spacing issues on the main landing page of the job board:

    White space – there’s a lot of white space above the job title. Is there anything we can do to reduce that above and below the title to help these look better on that main page? Can the title and the “apply now” button be on the same line?

    Wrapping – the wrapping around the title when it goes onto 2 lines has a lot of line spacing. Can that be reduced? See second job for example.

    Columns – Can we make the category columns wider to span the full width of the text also make the Locations column wider to get that more room? If you scroll down the Current Openings page to the Cultural Resources Discipline Leader job you’ll see why that’s needed.

    The page I need help with: [log in to see the link]

Viewing 8 replies - 1 through 8 (of 8 total)

  • HI @mindylll,

    Thanks for writing to us.

    We have diagnosed the issue on your end. White spaces and wrapping issue is being caused due to the CSS rule for #content h4{} written in the style.css file of your activated theme as well as extra <br> and <p> tags around the title HTML. Please switch your theme or remove the effective CSS rules and tags to prevent this issue.

    Furthermore, in order to increase the width for job categories and locations please add the following CSS to WordPress Dashboard-> Customize-> Additional CSS

    .sjb-page .sjb-listing .list-data .v2 .col-xs-12 {
    width: 100%;
}

    Feel free to reach out for further assistance.

    Regards,

    Thread Starter mindylll

    (@mindylll)

    I just removed the 20pixels spacing set in the style.css file above and below h4 and it did not remove the white area above and below the job board titles. Can you please provide some other CSS that can be applied JUST to the job board h4’s that will remove this white space?

    BTW, thank you so much for the other code. That worked beautifully!

    Hi @mindylll,

    We want to tell you that the extra white spaces are being added due to the CSS added to your theme. Please update the rule #content h4{} or remove it completely from the style.css file of your actuated theme to resolve this issue.

    However, there are also extra <p> and <br> tags added, please check the image below for reference. This seems to be added due to any activated plugin or themes because Simple Job Board doesn’t add such tags. So please deactivate the plugins one by one or change the theme and check if the issue is resolved.

    Image URL: https://ibb.co/NjjMbd2

    Furthermore, we are glad that the CSS worked however to make CSS more precise please replace the previously added CSS with the following CSS:

    .sjb-page .sjb-listing .list-data .v2 .sjb-job-type-location-date .col-xs-12 {
    width: 100%;
}

    Feel free to reach out for further assistance.

    Thread Starter mindylll

    (@mindylll)

    I just inserted your most recent code and that actually helped nicely with the spacing underneath the h4. Can you provide me with something additional to take care of the spacing above? It looks like part of the problem is that maybe the h4 is not on the same row as the apply now button. It’s almost as if there is something above it, but that is blank for some reason.

    I also tested out on a testing server by removing the entire CSS snippet for #content h4 as you suggested. This had no effect. The spacing was still there.

    Thread Starter mindylll

    (@mindylll)

    I THINK it might be because the company logo is not there?

    Hi @mindylll,

    We are glad to know the spaces are reduced.

    We are unable to provide you with an additional quick fix because the extra <p> or <br> tags, as well as #content h4 conflict, are being added due to any third-party plugins or theme.

    We would suggest you take the help of any theme developer to resolve such issues.

    Furthermore, removing #content h4 hasn’t shown results due to the cache, so please remove up cache as well. Moreover, if you haven’t added the company logo it will still not cause any extra spaces.

    Feel free to reach out for further assistance.

    Regards,

    Thread Starter mindylll

    (@mindylll)

    I again removed the #content h4 margin top padding of 20 pixels from the theme’s CSS code and deleted cache and also tested in another browser and the spacing above was still there.

    I just set up a testing server so that I could deactivate plugins and themes to test. I deactivated all plugins except the job board and I activated the default Twenty Twenty-One WordPress theme and the spacing above was still there.

    I know that the job board plugin was adding a TON of additional white spacing on the individual job post pages that I had to remove using CSS code. It was a bunch of things that needed to be hidden like company name, company logo, etc. and also a bunch of spacing above and below these items. I presume that this also might be what is causing the issues here, but I’m not sure. Can you please take another look.

    Hi @mindylll,

    In order to fully debug your issue, we need to diagnose your backend code.

    Please drop a query at [email protected] so we can provide you with an optimal solution.

    Regards,

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘Spacing issues’ is closed to new replies.