diff --git a/src/renderer/src/pages/settings/MCPSettings/McpServerCard.tsx b/src/renderer/src/pages/settings/MCPSettings/McpServerCard.tsx
index 518849d4f0..3d38255bf5 100644
--- a/src/renderer/src/pages/settings/MCPSettings/McpServerCard.tsx
+++ b/src/renderer/src/pages/settings/MCPSettings/McpServerCard.tsx
@@ -183,6 +183,7 @@ const CardContainer = styled.div<{ $isActive: boolean }>`
   margin-bottom: 5px;
   height: 125px;
   opacity: ${(props) => (props.$isActive ? 1 : 0.6)};
+  width: calc(100vw - var(--settings-width) - 40px);
 
   &:hover {
     opacity: 1;
diff --git a/src/renderer/src/pages/settings/MCPSettings/McpServersList.tsx b/src/renderer/src/pages/settings/MCPSettings/McpServersList.tsx
index 67ae6231a8..7e18af264d 100644
--- a/src/renderer/src/pages/settings/MCPSettings/McpServersList.tsx
+++ b/src/renderer/src/pages/settings/MCPSettings/McpServersList.tsx
@@ -249,7 +249,9 @@ const McpServersList: FC = () => {
         items={filteredMcpServers}
         itemKey="id"
         onSortEnd={onSortEnd}
-        layout="grid"
+        layout="list"
+        horizontal={false}
+        listStyle={{ display: 'flex', flexDirection: 'column' }}
         gap="12px"
         restrictions={{ scrollableAncestor: true }}
         useDragOverlay