I was hoping to learn HTML & CSS with the help of Webflow. And for this I would need to see the code as I’m modifying the elements. I’ve only been able to see “export code” button, which is inconvenient for my needs: I need to click it, wait for it to load, and the three small columns in a pop-up are not enough to see the whole code, and they don’t have scrollbars. So, my question is: Is there any way to see the code side-by-side with the design area, seeing it change dynamically as I modify the elements?
@space_mike That’s not currently a feature in Webflow BUT what you can do is export the code and download Espresso — The Web Editor for Mac. From there you can muck around with you code with the preview window open. By doing this you’re able to see your changes and what elements affect what in real-time.
Thank you for your reply! I may start using Espresso. But still it seems that Webflow is missing this important functionality, which seems easy to implement and which would have been very helpful in learning: Webflow has all the possible values for all the properties in the style editor, which means I can click on each and see what happens and then remember the code. This would make it much easier and more fun to learn the code, then reading about all the possible values and what they do then typing them one by one.
You can just drag a little bit around, publish it and look on the published site what has changed in the code with Google Developer Tools or Firefox Firebug or something similar.
Or you can directly play around there if you want to learn about it.
It would be useful for learning purposes but as Webflow is not supposed to be a learning platform I don’t think it’s an important functionality. The beauty of Webflow is that you do NOT have to look at the code but can do the styling in the editor.