diff --git a/src/views/ChatPanel/InputMessage.tsx b/src/views/ChatPanel/InputMessage.tsx
index 7ff7283..a95b528 100644
--- a/src/views/ChatPanel/InputMessage.tsx
+++ b/src/views/ChatPanel/InputMessage.tsx
@@ -6,7 +6,7 @@ import { IconGitBranchChecked, IconShellCommand, IconMouseRightClick } from "./I
 import messageUtil from '../../util/MessageUtil';
 
 const InputMessage = (props: any) => {
-    const { generating, chatContainerRect, onSendClick } = props;
+    const { generating, width, onSendClick } = props;
 
     const theme = useMantineTheme();
     const [commandMenus, commandMenusHandlers] = useListState<{ pattern: string; description: string; name: string }>([]);
@@ -375,7 +375,7 @@ const InputMessage = (props: any) => {
                 position='top-start'
                 closeOnClickOutside={true}
                 shadow="sm"
-                width={chatContainerRect.width}
+                width={width}
                 opened={menuOpend}
                 onChange={() => {
                     setMenuOpend(!menuOpend);
@@ -479,7 +479,7 @@ const InputMessage = (props: any) => {
                                     fz='sm'
                                     m='12px 5px'
                                     truncate='end'
-                                    w={chatContainerRect.width - 60}>
+                                    w={width - 60}>
                                     Tips: Select code or file & right click
                                 </Text>
                             </Flex>
diff --git a/src/views/ChatPanel/MessageContainer.tsx b/src/views/ChatPanel/MessageContainer.tsx
index ea7b89e..e8559aa 100644
--- a/src/views/ChatPanel/MessageContainer.tsx
+++ b/src/views/ChatPanel/MessageContainer.tsx
@@ -9,7 +9,7 @@ import SvgAvatarDevChat from './avatar_devchat.svg';
 import SvgAvatarUser from './avatar_spaceman.png';
 
 const MessageContainer = (props: any) => {
-    const { generating, messages, chatContainerRect, responsed } = props;
+    const { generating, messages, width, responsed } = props;
 
     const DefaultMessage = (<Center>
         <Text size="lg" color="gray" weight={500}>No messages yet</Text>
@@ -143,7 +143,7 @@ const MessageContainer = (props: any) => {
                 spacing={0}
                 key={`message-${index}`}
                 sx={{
-                    width: chatContainerRect.width,
+                    width: width,
                     padding: 0,
                     margin: 0,
                 }}>
@@ -151,7 +151,7 @@ const MessageContainer = (props: any) => {
                 <Container sx={{
                     margin: 0,
                     padding: 0,
-                    width: chatContainerRect.width,
+                    width: width,
                     pre: {
                         whiteSpace: 'break-spaces'
                     },
diff --git a/src/views/ChatPanel/index.tsx b/src/views/ChatPanel/index.tsx
index 33d7563..b67c4bf 100644
--- a/src/views/ChatPanel/index.tsx
+++ b/src/views/ChatPanel/index.tsx
@@ -181,11 +181,11 @@ const chatPanel = () => {
                 }}
                 // onScrollPositionChange={onScrollPositionChange}
                 viewportRef={scrollViewport}>
-                <MessageContainer generating={generating} messages={messages} chatContainerRect={chatContainerRect} responsed={responsed} />
+                <MessageContainer width={chatContainerRect.width} generating={generating} messages={messages} responsed={responsed} />
             </ScrollArea>
             <Stack
                 spacing={5}
-                sx={{ position: 'absolute', bottom: 10, width: chatContainerRect.width }}>
+                sx={{ position: 'absolute', bottom: 10, width: 'calc(100% - 20px)' }}>
                 {generating &&
                     <Center>
                         <StopButton />
@@ -198,7 +198,7 @@ const chatPanel = () => {
                 }
                 <InputMessage
                     generating={generating}
-                    chatContainerRect={chatContainerRect}
+                    width={chatContainerRect.width}
                     onSendClick={(input: string, contexts: any) => {
                         // Add the user's message to the chat UI
                         messageHandlers.append({ type: 'user', message: input, contexts: contexts ? [...contexts].map((item) => ({ ...item })) : undefined });