My design team uses Webflow to create prototypes that we pass to our front end team for development. We have an existing have a class for a selector that the front-end team is currently using in production, but I can’t style selectors in Webflow’s designer so I needed to do it via custom CSS. I copied the code from our site for the selector from our existing CSS, where the name for the class was «.newSelector». I then added a class to the selector in the Webflow designer and gave it the same name: «newSelector».
But because Webflow converted my class to lowercase after publishing, it didn’t work on the live site as the code was calling for .newSelector and Webflow was rendering .newselector. It only took me a moment to figure out why, but if I had known that Webflow modified my class, I could have wouldn’t have used the class name with cap. I also could have avoided exiting the designer, going back to the CSS editor, modifying the CSS code to match the actual class Webflow publishes, and republishing. It’s a very small annoyance though—going forward, I always make sure I am using lowercase class names when I copy and paste custom CSS. Thanks for considering my feedback!