diff --git a/app/src/assets/scss/_list.scss b/app/src/assets/scss/_list.scss
index 2282f058f..4a01aaed8 100644
--- a/app/src/assets/scss/_list.scss
+++ b/app/src/assets/scss/_list.scss
@@ -63,12 +63,16 @@
     text-align: left;
     border: 0;
     color: var(--b3-theme-on-background);
-    margin: 0 8px !important;
+    margin: 0 8px;
 
     &[draggable="true"]:active {
       cursor: grabbing;
     }
 
+    &--narrow {
+      margin: 0;
+    }
+
     &--big {
       padding: 16px 24px;
 
diff --git a/app/src/card/makeCard.ts b/app/src/card/makeCard.ts
index 41ec39478..0048ac014 100644
--- a/app/src/card/makeCard.ts
+++ b/app/src/card/makeCard.ts
@@ -14,7 +14,7 @@ import {escapeHtml} from "../util/escape";
 import {getDisplayName, getNotebookName} from "../util/pathName";
 
 const genCardItem = (item: ICard) => {
-    return `<li style="margin: 0 !important;" data-id="${item.id}" class="b3-list-item${isMobile() ? "" : " b3-list-item--hide-action"}">
+    return `<li data-id="${item.id}" class="b3-list-item b3-list-item--narrow${isMobile() ? "" : " b3-list-item--hide-action"}">
 <span class="b3-list-item__text">${item.name}</span>
 <span class="counter b3-tooltips b3-tooltips__w${isMobile() ? "" : " fn__none"}" aria-label="${window.siyuan.languages.riffCard}">${item.size}</span>
 <span data-type="add" class="b3-list-item__action b3-tooltips b3-tooltips__w" aria-label="${window.siyuan.languages.addDeck}">