Title: Two Issues with Jetpack CSS Module Last modified: August 20, 2016 --- # Two Issues with Jetpack CSS Module * Resolved [cpoteet](https://wordpress.org/support/users/cpoteet/) * (@cpoteet) * [13 years, 1 month ago](https://wordpress.org/support/topic/two-issues-with-jetpack-css-module/) * I noticed two big issues when using the CSS module. * 1. When you add CSS (in this case I pasted) CSS where the properties where uppercased, on saved the plugin completely removed them. * So this * .class { COLOR: #fff; } * Became * .class { #fff; } * 2. When you add an !important it messes with it. * So This * .class { color: #fff !important; } * Became * .class { color: #fff!important; } * [http://wordpress.org/extend/plugins/jetpack/](http://wordpress.org/extend/plugins/jetpack/) Viewing 8 replies - 1 through 8 (of 8 total) * Plugin Author [Jeremy Herve](https://wordpress.org/support/users/jeherve/) * (@jeherve) * Jetpack Mechanic 🚀 * [13 years, 1 month ago](https://wordpress.org/support/topic/two-issues-with-jetpack-css-module/#post-3638005) * The Custom CSS module will indeed validate and sanitize the CSS you enter in the custom CSS editor. `color: #fff!important;` will work just fine, however you’ll need to use lowercase for CSS properties. * If you do not want your custom CSS to be sanitized, I would suggest that you add it to your theme stylesheet, under `wp-content/themes/your-theme/style.css`. * Thread Starter [cpoteet](https://wordpress.org/support/users/cpoteet/) * (@cpoteet) * [13 years, 1 month ago](https://wordpress.org/support/topic/two-issues-with-jetpack-css-module/#post-3638008) * The sanitizing is a bit of a pain especially when you give the user absolutely no warning in the UI or after sanitizing. At the very least there should be some user feedback on why their CSS was just destroyed. * However, the !important thing is an issue. It is changing * color: #fff !important * to * color: #fff!important * When it changes it to the latter it obviously doesn’t render correctly in the browser. That is an actual bug IMO. * Plugin Author [Jeremy Herve](https://wordpress.org/support/users/jeherve/) * (@jeherve) * Jetpack Mechanic 🚀 * [13 years, 1 month ago](https://wordpress.org/support/topic/two-issues-with-jetpack-css-module/#post-3638017) * > The sanitizing is a bit of a pain especially when you give the user absolutely > no warning in the UI or after sanitizing. At the very least there should be > some user feedback on why their CSS was just destroyed. * That’s true. We do add [icons](http://i.wpne.ws/ODTA) to warn you of any problems with your CSS, but it could be more visible. I took note of your feedback, thanks! * > When it changes it to the latter it obviously doesn’t render correctly in the > browser. * I tried on my own site, and it didn’t seem to create any problem, my change was properly displayed in the browser. Do you experience the issue in a specific browser? * Thread Starter [cpoteet](https://wordpress.org/support/users/cpoteet/) * (@cpoteet) * [13 years, 1 month ago](https://wordpress.org/support/topic/two-issues-with-jetpack-css-module/#post-3638018) * > That’s true. We do add icons to warn you of any problems with your CSS, but > it could be more visible. I took note of your feedback, thanks! * But what’s interesting is that you don’t add an indicator for properties in all caps. They just get erased on save without any warning. * > I tried on my own site, and it didn’t seem to create any problem, my change > was properly displayed in the browser. Do you experience the issue in a specific > browser? * You can see my stylesheet here. One the .car-list,.car-list li selector you can see the !important squished together with the value. [http://www.siolon.com/?custom-css=1&csblog=1&cscache=6&csrev=16](http://www.siolon.com/?custom-css=1&csblog=1&cscache=6&csrev=16) * Plugin Author [Jeremy Herve](https://wordpress.org/support/users/jeherve/) * (@jeherve) * Jetpack Mechanic 🚀 * [13 years, 1 month ago](https://wordpress.org/support/topic/two-issues-with-jetpack-css-module/#post-3638019) * > But what’s interesting is that you don’t add an indicator for properties in > all caps. * There should indeed be warning. I took note of the problem, and we’ll get this fixed. * > You can see my stylesheet here. One the .car-list,.car-list li selector you > can see the !important squished together with the value. > [http://www.siolon.com/?custom-css=1&csblog=1&cscache=6&csrev=16](http://www.siolon.com/?custom-css=1&csblog=1&cscache=6&csrev=16) * Thanks for the extra details. * I checked your site, and the margin value seems to be correctly applied to your list: [http://i.wpne.ws/OFKU](http://i.wpne.ws/OFKU) * Thread Starter [cpoteet](https://wordpress.org/support/users/cpoteet/) * (@cpoteet) * [13 years, 1 month ago](https://wordpress.org/support/topic/two-issues-with-jetpack-css-module/#post-3638021) * > I checked your site, and the margin value seems to be correctly applied to > your list: > [http://i.wpne.ws/OFKU](http://i.wpne.ws/OFKU) * Thanks Jeremy. Perhaps I should’ve added it to something that actually needed the important. I did now, and it does seem to work. * [http://www.siolon.com/archives/](http://www.siolon.com/archives/) * I guess I still find it odd that only in the case of adding the !important does it smush the value and the !important together. I guess this is less a bug and more a request that the editor not display it in this manner. The spec says there should be a space between them [http://www.w3.org/TR/CSS21/cascade.html#important-rules](http://www.w3.org/TR/CSS21/cascade.html#important-rules) * Plugin Author [Jeremy Herve](https://wordpress.org/support/users/jeherve/) * (@jeherve) * Jetpack Mechanic 🚀 * [13 years, 1 month ago](https://wordpress.org/support/topic/two-issues-with-jetpack-css-module/#post-3638022) * > guess I still find it odd that only in the case of adding the !important does > it smush the value and the !important together. I guess this is less a bug > and more a request that the editor not display it in this manner. * It’s true that we could add a space there. We’ll consider making the change. * In the meantime, we got that Uppercase problem fixed. The fix will be available with the next Jetpack release. * Thread Starter [cpoteet](https://wordpress.org/support/users/cpoteet/) * (@cpoteet) * [13 years, 1 month ago](https://wordpress.org/support/topic/two-issues-with-jetpack-css-module/#post-3638026) * Thanks Jeremy. I appreciate your replies. I’m excited about this because it allows me to retire my Persistent Styles Plugin. * [http://wordpress.org/extend/plugins/persistent-styles-plugin/](http://wordpress.org/extend/plugins/persistent-styles-plugin/) Viewing 8 replies - 1 through 8 (of 8 total) The topic ‘Two Issues with Jetpack CSS Module’ is closed to new replies. * ![](https://ps.w.org/jetpack/assets/icon.svg?rev=2819237) * [Jetpack - WP Security, Backup, Speed, & Growth](https://wordpress.org/plugins/jetpack/) * [Frequently Asked Questions](https://wordpress.org/plugins/jetpack/#faq) * [Support Threads](https://wordpress.org/support/plugin/jetpack/) * [Active Topics](https://wordpress.org/support/plugin/jetpack/active/) * [Unresolved Topics](https://wordpress.org/support/plugin/jetpack/unresolved/) * [Reviews](https://wordpress.org/support/plugin/jetpack/reviews/) ## Tags * [css](https://wordpress.org/support/topic-tag/css/) * 8 replies * 2 participants * Last reply from: [cpoteet](https://wordpress.org/support/users/cpoteet/) * Last activity: [13 years, 1 month ago](https://wordpress.org/support/topic/two-issues-with-jetpack-css-module/#post-3638026) * Status: resolved