diff --git a/client/web/src/components/SidebarView.tsx b/client/web/src/components/SidebarView.tsx
index 6e86e19a..1a389adc 100644
--- a/client/web/src/components/SidebarView.tsx
+++ b/client/web/src/components/SidebarView.tsx
@@ -157,7 +157,7 @@ export const SidebarView: React.FC<SidebarViewProps> = React.memo((props) => {
         </div>
 
         <div
-          className="pt-24 pb-20 px-10 desktop:overflow-auto"
+          className="pt-24 pb-20 px-10 mobile:pt-10 mobile:px-2 desktop:overflow-auto"
           style={{ flex: '1 1 800px' }}
         >
           {content}
diff --git a/client/web/src/components/modals/GroupDetail/Role/index.tsx b/client/web/src/components/modals/GroupDetail/Role/index.tsx
index 30bae727..21814615 100644
--- a/client/web/src/components/modals/GroupDetail/Role/index.tsx
+++ b/client/web/src/components/modals/GroupDetail/Role/index.tsx
@@ -36,7 +36,7 @@ export const GroupRole: React.FC<GroupPermissionProps> = React.memo((props) => {
   return (
     <Loading spinning={loading} className="h-full">
       <div className="flex h-full">
-        <div className="pr-2 mr-2 w-40 border-r border-white border-opacity-20">
+        <div className="pr-2 mr-2 w-40 mobile:w-28 border-r border-white border-opacity-20">
           {/* 角色列表 */}
           <RoleItem
             active={roleId === AllPermission}