diff --git a/crates/bin/docs_rs_web/templates/style/style.scss b/crates/bin/docs_rs_web/templates/style/style.scss
index 2f07b1c9f..036de8b82 100644
--- a/crates/bin/docs_rs_web/templates/style/style.scss
+++ b/crates/bin/docs_rs_web/templates/style/style.scss
@@ -378,12 +378,14 @@ div.recent-releases-container {
     .description {
         font-family: $font-family-serif;
         font-weight: normal;
+        overflow-wrap: break-word;
 
         @media #{$media-sm} {
             font-size: 1em;
             white-space: nowrap;
             overflow: hidden;
             text-overflow: ellipsis;
+            overflow-wrap: normal;
         }
     }
 
diff --git a/gui-tests/long-crate-description.goml b/gui-tests/long-crate-description.goml
new file mode 100644
index 000000000..2cfb0fee1
--- /dev/null
+++ b/gui-tests/long-crate-description.goml
@@ -0,0 +1,18 @@
+// Checks that a crate description with a very long sequence of characters doesn't result in a horizontal scroll bar
+
+go-to: |DOC_PATH| + "/releases/search?query=sysinfo"
+
+store-value: (description_selector, "div.recent-releases-container .description")
+
+set-text: (|description_selector|, "SOME/VERYVERY/LONG/SEQUENCE/OF/TEXT/SEPARATED/BY/SLASHES\nAnotherveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryveryverylongWord")
+
+// Set width to size smaller than media-sm as that's when we don't truncate the text
+store-value: (screen_width, 567)
+set-window-size: (|screen_width|, 800)
+
+store-property: (|description_selector|, {"scrollWidth": description_width})
+
+// Check that the description width isn't wider than the screen.
+// It should be smaller due to padding, but if it overflows it'll be wider than the screen anyway.
+assert-false: |description_width| > |screen_width|
+