Custom code causing styling issues on additional elements added to page

How can this…

Result in this? …

There is something seriously wrong with the designer at the moment. Everything is getting scrambled (size & position) and sections either do not display or display incorrectly. I am fearful of doing any edits just now because the whole site is getting scrambled.

Please take a look at the Just Covers site

The relevant pages (thus far) are leaf-covers-2 and leaf-debris-mesh-pool-cover.

In the case of the leaf-covers-2 page, the whole page has assumed the color of the footer.

In the case of the leaf-debris-mesh-pool-cover page. If I place a new section on this page, the new section will not display at all!

I have even tried recreating the page from scratch and using different classes, but that has not been successful either.

Thank-you in anticipation.

Allan

Hi @AllanG, could you help to share the published site url and also the read-only link to the site? Share a read-only link | Webflow University

Also, could you please confirm, what browser is being used and what operating system?

Thanks in advance.

Hi Dave,

Live pages are at https://justcovers.com.au/leaf-cover-2.html (This is a test page and was my unsuccessful attempt at reconstructing the original problem page which was scrambled). The original problem page is at Leaf & Debris Winter Mesh Pool Cover - Just Covers Since my first support email, I had to make changes to this page which is one of our main sales pages.

The preview link is at https://preview.webflow.com/preview/justcovers?preview=c9ca0484b211e9502cfebd4108589d4e

You are welcome to muck with the live test page https://justcovers.com.au/leaf-cover-2.html if you wish.

Try, for instance, adding another section. It will not be visible when published!

I appreciate your assistance.

Allan

Sorry, browser is Chrome, but IE also renders incorrectly.

Allan

System is Windows 10

Hi Dave,

Just interested if you can see the problem that I am describing and wondering if you are you getting anywhere with this issue? The silence is deafening!

Regards,

Allan

Hi @AllanG, I have been able to reproduce the issue on the site, it appears that one custom code html embed seems to be causing the issue:

Once the custom code is removed and the site published, the issue should resolve immediately.

I would either remove that custom code, or check it, it seems you are trying to embed a custom video. I might suggest an alternate method: [Tutorial] Responsive Video using HTML Embed.

I hope this helps!

Thanks Dave, for your suggestions.

That same embed is placed on a number of our pages and it is not creating any issues elsewhere. The code in the embed is also used multiple times on different pages, but pointing to various other URL’s without incident.

The page in question is acting randomly and I don’t believe it has anything to do with the embed.

For instance, I removed the embed (amended page now published on webflow) and you will see that the orange footer SECTION is rendering like a CONTAINER. This is not occurring on any other pages in my site.

Also, if you place the same same HTML embed BELOW the footer, the page renders normally (with the exception of the orange footer SECTION which still acts like a CONTAINER).

There is definitely a bug somewhere that is causing this random behavior.

I reckon the strange behavior stems from a rich text issue. For instance, if I select and copy column 1, then paste it elsewhere, it pastes column 2 as well, below column 1 as a single column. BUT COLUMN 2 was not selected!

Maybe I need to create the page and all elements from scratch? This is a big task, though, because (aside from the tying and code) creating a new page will cause me to have to replace all relevant links from the entire site.

Your continued investigation of this issue is appreciated.

Allan

u

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.