diff --git a/themes/hexo/LayoutBase.js b/themes/hexo/LayoutBase.js
index 8f2a2e54..43291ef8 100644
--- a/themes/hexo/LayoutBase.js
+++ b/themes/hexo/LayoutBase.js
@@ -47,7 +47,7 @@ const LayoutBase = (props) => {
 
     <main id='wrapper' className='w-full justify-center py-8 min-h-screen'>
 
-      <div id='container-inner' className='pt-14 w-full mx-auto lg:flex justify-between space-x-4 max-w-7xl'>
+      <div id='container-inner' className='pt-14 w-full mx-auto lg:flex justify-between md:space-x-4 max-w-7xl'>
         <div className='flex-grow w-full'>{children}</div>
         <SideRight {...props}/>
       </div>
diff --git a/themes/hexo/components/ArticleDetail.js b/themes/hexo/components/ArticleDetail.js
index 02a441ef..aa4dbb4c 100644
--- a/themes/hexo/components/ArticleDetail.js
+++ b/themes/hexo/components/ArticleDetail.js
@@ -68,7 +68,7 @@ export default function ArticleDetail ({ post, recommendPosts, prev, next }) {
     <hr className='border-dashed'/>
 
     {/* 评论互动 */}
-    <div className="duration-200  overflow-x-auto bg-white dark:bg-gray-800">
+    <div className="duration-200  overflow-x-auto bg-white dark:bg-gray-800 px-3">
        <Comment frontMatter={post} />
     </div>
   </div>)
diff --git a/themes/hexo/components/SideRight.js b/themes/hexo/components/SideRight.js
index 2335c054..47a391c5 100644
--- a/themes/hexo/components/SideRight.js
+++ b/themes/hexo/components/SideRight.js
@@ -19,7 +19,7 @@ export default function SideRight (props) {
   } = props
 
   return (
-    <div className={'w-80 space-y-4'}>
+    <div className={'md:w-80 p-2 space-y-4'}>
       <InfoCard {...props}/>
       <AnalyticsCard {...props}/>