diff --git a/css/main.css b/css/main.css
index 51bf71b2c9..4c63314661 100644
--- a/css/main.css
+++ b/css/main.css
@@ -719,19 +719,17 @@ input::placeholder {
   color: #e5e5e5;
 }
 
-code,
-a code,
-.mainContainer .wrapper a code,
-.mainContainer .wrapper a:focus code {
-  color: #2E8555;
-  font-family: "SFMono-Regular",source-code-pro,Menlo,Monaco,Consolas,"Roboto Mono","Droid Sans Mono","Liberation Mono",Consolas,"Courier New",Courier,monospace;
-}
-
-a code {
-  text-decoration: underline;
-}
-a:hover code {
-  text-decoration: none;
+code {
+  padding: 2px 0;
+  background-color: rgba(46, 133, 85, 0.07);
+  /* box-shadow acts as padding around inline code snippets
+   * while not adding any extra spacing between words. */
+  box-shadow: 2px 0 rgba(46, 133, 85, 0.07), -2px 0 rgba(46, 133, 85, 0.07);
+  color: inherit;
+  border-radius: .3em;
+  font-family: "SFMono-Regular",source-code-pro,Menlo,Monaco,Consolas,"Roboto Mono","Droid Sans Mono","Liberation Mono",Consolas,"Courier New",Courier,monospace;  
+  /* avoids scale issues on mobile */
+  word-break: break-word;
 }
 
 pre code {