Web site formatting suddenly broke — What did I do?

  • Resolved Brucewh

    (@brucewh)


    8 years, 7 months ago

    I administer the stjameskent.org website. It has been running fine for over a year. But right after Easter it went all to heck. The left sidebar appears to be very short. The right sidebar (or its container) is far too wide. Everything below the site’s banner and menu bar is shoved way too far down the page.

    I’ve been trying to identify where I messed up the formatting to cause this, but have gotten nowhere. It is a site-wide problem.

    Doing an Inspect on the large empty space below the menu bar, I found this block of code:

    #main {
    clear: both;
    margin: 0 auto;
    overflow: hidden;
    padding: 1em 0 0 0;
}

    When I change that to overflow: visible; in the Inspect pane, the center content moves up to the intended vertical position. Unfortunately, that block is in the WordPress code, and I’m not finding any way to override it.

    I have not made changes to any of the Weaver II theme files. Actually, I don’t know how. But that’s a different discussion.

    I have changed several Weaver II settings in the Dashboard, but I’ve done that more than once in the past two years, Never a problem before, but now nothing I do with the settings improves things.

    Could somebody please point me in the direction of the flagrantly obvious problem? I’m facing the rack, the comfy chair, and the soft cushion if I don’t solve this. Please help before I am confronted by people nobody expects.

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

  • This is typically caused by some HTML syntax error in your content like open / closed html tag errors. These break the layout of the page and produce variable outcome on different browsers.

    Inspecting the page, I can see the layout of the HTML is messed up. Running your site through an HTML validator does show some div open close tag errors. especially a lonely closing </div> at line 1262 below in bold in your sidebar content
    <!– Single Service –>
    <span style=”display: none;”></span> </div>
     </aside><aside id=”text-5″ class=”widget widget_text”><h3 class=”widget-title”>Liturgical Calendar</h3> <div class=”textwidget”><p><span style=”display: none;”></span>

    Remove that orphan </div> and all should be good, if not check for more errors.
    In the future, post in the Weaver forum (below) as this one is not monitored.
    https://forum.weavertheme.com

    looking closer you have other problems in addition to the one I mentioned below.
    You have a number of lines like below
    <!!-NOTE FOR MAINTENANCE — ALSO DISABLED BIBLE VERSE OF THE DAY (DECENT SOFTWARE NEEDED)-!!>

    That are flagged as invalid HTML and could be breaking more things.
    If these are supposed to be HTML comments, the proper syntax for them would be

    <!–NOTE FOR MAINTENANCE — ALSO DISABLED BIBLE VERSE OF THE DAY (DECENT SOFTWARE NEEDED)–!>

    The proper open an close comment being <!– xxxxxxx –!>
    You have many of these to correct all over

    I advise you to run your site through an HTML validator and review what you see there. Not all errors are important, but open close tag errors and things like above should be fixed.

    As I said, the issue with HTML errors is that browsers will attempt to fix them with unpredictable results, so some times it looks OK, then a small thing is changed and it throws the whole thing off.

    Thread Starter Brucewh

    (@brucewh)

    Okay, now I feel like a rookie. Oh … wait … I am! Thanks much, scrambler, for guiding me toward the Pathway of the Virtuous.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Web site formatting suddenly broke — What did I do?’ is closed to new replies.