diff --git a/src/class.rs b/src/class.rs
index 4edaddb..57d6f28 100644
--- a/src/class.rs
+++ b/src/class.rs
@@ -32,22 +32,24 @@ impl<'a> Class<'a> {
             rest.push_str(pseudo);
         }
 
-        // TODO we can probably skip the format here, we just need to push the char at the start
         if !rest.is_empty() {
             rest.insert(0, ':')
         }
 
-        format!(".{original}{rest}")
+        let mut r = format!("{original}{rest}")
             .replace('[', "\\[")
             .replace(']', "\\]")
             .replace('|', "\\|")
             .replace('(', "\\(")
             .replace(')', "\\)")
+            .replace('.', "\\.")
             .replace('#', "\\#")
             .replace('$', "\\$")
             .replace('\'', "\\'")
             .replace('*', "\\*")
-            .replace('%', "\\%")
+            .replace('%', "\\%");
+        r.insert(0, '.');
+        r
     }
 
     pub(crate) fn generate(&self, z: &Zephyr) -> Result<String, &'static str> {
diff --git a/src/lib.rs b/src/lib.rs
index f37c70a..20e1978 100644
--- a/src/lib.rs
+++ b/src/lib.rs
@@ -81,7 +81,7 @@ mod tests {
             pseudo: None,
             original: "m[1rem]",
         };
-        let css = class.generate(&z);
+        let css = class.generate(&z).unwrap();
         assert_eq!(css, r#".m\[1rem\] { margin: 1rem; }"#);
 
         let class = Class {
@@ -91,7 +91,7 @@ mod tests {
             pseudo: None,
             original: "m[1rem]focus",
         };
-        let css = class.generate(&z);
+        let css = class.generate(&z).unwrap();
         assert_eq!(css, r#".m\[1rem\]focus:focus { margin: 1rem; }"#);
 
         let class = Class {
@@ -101,7 +101,7 @@ mod tests {
             pseudo: None,
             original: "m[1rem]focus,hover,odd",
         };
-        let css = class.generate(&z);
+        let css = class.generate(&z).unwrap();
         assert_eq!(
             css,
             r#".m\[1rem\]focus,hover,odd:focus:hover:nth-child\(odd\) { margin: 1rem; }"#
@@ -129,6 +129,9 @@ mod tests {
             classes,
             r#".flex\|hover,focus\$placeholder:hover:focus::placeholder { display: flex; }"#
         );
+
+        let classes = z.generate_classes(["mr[0.5rem]"]);
+        assert_eq!(classes, r#".mr\[0\.5rem\] { margin-right: 0.5rem; }"#);
     }
 
     #[test]