diff --git a/.vitepress/theme/components/ArticleMasonry.vue b/.vitepress/theme/components/ArticleMasonry.vue
index 1cd0f46..da7990b 100644
--- a/.vitepress/theme/components/ArticleMasonry.vue
+++ b/.vitepress/theme/components/ArticleMasonry.vue
@@ -65,7 +65,7 @@ onUnmounted(() => {
 </script>
 
 <template>
-  <div id="articleMasonry">
+  <div class="ArticleMasonry">
     <div class="masonry-column" v-for="(column, index) in masonryGroups" :key="index">
       <MaterialCard
         v-for="item in column"
diff --git a/.vitepress/theme/styles/components/ArticleMasonry.scss b/.vitepress/theme/styles/components/ArticleMasonry.scss
index 134defe..0f3d856 100644
--- a/.vitepress/theme/styles/components/ArticleMasonry.scss
+++ b/.vitepress/theme/styles/components/ArticleMasonry.scss
@@ -1,4 +1,4 @@
-#articleMasonry {
+.ArticleMasonry {
   display: flex;
   align-items: flex-start;
   flex-direction: row;