Streaming live at 10am (PST)

Exported Code Renders Differently Outside of Webflow


#1

Hi,

I’m new to web flow (and web design/development). It seems that the code being generated by Webflow is not rendering correctly for me.

For example, I’ve used Webflow to create a simple section with a background image, a heading, and a button. (See here: https://webflow-code-test-01.webflow.io/)

When I export the code from Webflow, copy the HTML and CSS, and paste it into an online HTML/CSS editor (https://www.w3schools.com/tryit/), the results look significantly worse than they do in Webflow. In this example, the button looks quite different:

I have also repeated this process for some of the free templates provided by Webflow, and am seeing lots of differences between their appearance in the Webflow interface and the exported code being rendered elsewhere.

Does anyone have an explanation for this discrepancy? Am I missing something obvious?

Any help would be greatly appreciated.

Read-Only Link: https://preview.webflow.com/preview/webflow-code-test-01?utm_source=webflow-code-test-01&preview=49bd96647c5fa838abc38eab62966e2e

Live Site Link: https://webflow-code-test-01.webflow.io/


#2

It would be best to not use an online editor to re edit the exported code. Better to use dev tools in chrome.

Exported code includes html, css. JavaScript and your images. Webflow is cutting edge, most likely your online editor is not. Specs change, tools don’t necessarily support the same functionality. A current chrome browser will.