diff --git a/src/features/FileViewer/index.tsx b/src/features/FileViewer/index.tsx
index 3adaf9debb778..27661a6b45b19 100644
--- a/src/features/FileViewer/index.tsx
+++ b/src/features/FileViewer/index.tsx
@@ -1,7 +1,7 @@
 'use client';
 
 import DocViewer from '@cyntler/react-doc-viewer';
-import { createStyles } from 'antd-style';
+import { css, cx } from 'antd-style';
 import { CSSProperties, memo } from 'react';
 
 import { FileListItem } from '@/types/files';
@@ -10,12 +10,13 @@ import NotSupport from './NotSupport';
 import { FileViewRenderers } from './Renderer';
 import PDFRenderer from './Renderer/PDF';
 
-const useStyles = createStyles(({ css, token }) => ({
-  container: css`
-    padding: 12px;
-    background: ${token.colorBgLayout} !important;
-  `,
-}));
+const container = css`
+  background: transparent !important;
+
+  #proxy-renderer {
+    height: 100%;
+  }
+`;
 
 interface FileViewerProps extends FileListItem {
   className?: string;
@@ -23,14 +24,13 @@ interface FileViewerProps extends FileListItem {
 }
 
 const FileViewer = memo<FileViewerProps>(({ id, style, fileType, url, name }) => {
-  const { styles } = useStyles();
   if (fileType === 'pdf' || name.endsWith('.pdf')) {
     return <PDFRenderer fileId={id} url={url} />;
   }
 
   return (
     <DocViewer
-      className={styles.container}
+      className={cx(container)}
       config={{
         header: { disableHeader: true },
         noRenderer: { overrideComponent: NotSupport },