Strange behaviour of menu header on just one of many supposingly identical pages

Backlight 4, 5 & 6 Support
1

All pages on my site use the same menu centered in the header area e.g. https://www.reefimages.com/

but I have just edited the text for one of those pages and the header behavior has changed.the header is now two lines and the menu is not centered. see Introduction to Ocean Sciences - Reefimages . I have fiddled with this for some time and can not find a way to correct this (although I have tweaked the html to make the edited page usable since the edits resulted originally in the title and menu overlapping on the page). The only possibly relevant difference I can find in the generated page structure is a different value for

but I can not find a way to change that. Cloning the page, copying page html into a new page, cleraing template cache etc have all failed to correct this. Please advise.

2

There are a lot of html errors:

https://validator.w3.org/nu/?doc=https%3A%2F%2Fwww.reefimages.com%2Foceansci.php

3

Hey Douglas, long time no see. Hope you’re doing well!

Another option is using chatgpt.com. It provides an explanation of issues encountered with the page. But better might be if you just copy the text you just edited into ChatGPT and let it fix for you. This way you don’t have to worry about the Backlight page scafolding.

Best, Daniel

4

Looks like many of those errors are in the generated page code. I have fixed some of the “errors” in the body code and am chasing a couple more down but that has not changed the orignal issue yet and all those I have not fixed were in the page before the latest edits so I think the haeader/menu issue is not the reult of these remaining errors (mosltly old code that still works but where css or diffferent syntax is now preffered)

5

Page body code:

* Missing > on the <img> tag (critical)
* Broken JavaScript:
eventLabel: 'Downloaded'16
* Remove all stray \
* Fix unmatched <b> tags
* Fix <p><p>
* Convert http links to https

6

Thanks Daniel. Great advice as usual. I did not think of Chatgpt but, you are correct, it is much easier to use than W3. I have now fixed most or all of the bad html but it has not fixed the wierd menu issue. However, I think I am just going to leave it as is for now as that page is now fully functional and it goes away completely in a few more days. That internal links on y site will be replaced by a direct link to my new book edition, but I would like to also use a simple timed redirect page consisting of only a simple text message that the page has moved. Any thoughts on the best way to add a timed redirect without offending the Google gods? The original page address has about 30,000 hits a year, mostly from outside my site so I don;t just want them to see a page not found messsage

7

that may be related to what appears to be missing closing divs (</div> ) in the_copy div area

8

At the beginning of your page content, you have

<div>
<br><br></div><div>....

Remove the closing div in the second line and see if this fixes it.