Exported code renders wrong

I’ve exported this site: https://webflow.com/website/Gooru-Home-iowtfc78?s=gooruhome

When opening the index.html file on chrome or firefox, it renders terribly. I thought it just wasn’t loading the stylesheets, but upon closer look, it does load them but it’s cherrypicking the classes it wants to read. Even weirder still, opening the index.html on safari renders ok.


After a good while of trying to figure out the issue I isolated the problem to 2 classes in class ._w-achievementsection and class ._w-testimonialsection. Specifically because it had apostrophes in the image name.

Example:
._w-testimonialsection {
background-image: -webkit-linear-gradient(179deg, #2f4555 , rgba(39, 49, 56, .27)), url(‘…/images/Sophia’sClass.jpg’);
background-image: linear-gradient(271deg, #2f4555 , rgba(39, 49, 56, .27)), url(‘…/images/Sophia’sClass.jpg’);

Every css line after those two classes get ignored in both chrome and firefox. I figured this is actually a Chrome bug and have reported it. But if anyone has had similar issues or thoughts on this would be good to hear.

After changing the image names that had the apostrophe on webflow and exported the site, I can now comfirm the problem has been solved. However, the images themselves aren’t exporting for some reason. Will update if I figure it out.

1 Like

Avoid using special characters in the images names :wink: it may even cause the problems with the exporting this images too