diff --git a/frontend/src/components/InstanceView.jsx b/frontend/src/components/InstanceView.jsx
index e17bf9f..db4850e 100644
--- a/frontend/src/components/InstanceView.jsx
+++ b/frontend/src/components/InstanceView.jsx
@@ -59,7 +59,7 @@ export const InstanceView = ({ templateName, objectID, endpoint }) => {
   return (
     <div
       ref={contentRef}
-      className={`html-content relative mx-auto box-border h-[75vh] max-h-full overflow-auto rounded-lg border-4 border-transparent bg-gray-100 p-8 text-gray-700 shadow-lg scrollbar scrollbar-track-gray-200 scrollbar-thumb-gray-400 hover:border-gray-300 dark:bg-custom-dark-2 dark:text-gray-100 dark:shadow-dark dark:scrollbar-track-custom-dark-3 dark:scrollbar-thumb-slate-600 md:w-[210mm] print:m-0 print:bg-transparent print:p-0 print:shadow-none ${
+      className={`html-content rounded-lg border-4 border-transparent bg-gray-100 p-8 text-gray-700 shadow-lg scrollbar scrollbar-track-gray-200 scrollbar-thumb-gray-400 hover:border-gray-300 dark:bg-custom-dark-2 dark:text-gray-100 dark:shadow-dark dark:scrollbar-track-custom-dark-3 dark:scrollbar-thumb-slate-600 md:w-[210mm] print:m-0 print:bg-transparent print:p-0 print:shadow-none ${
         isHovering ? "z-50 shadow-md" : ""
       }`}
       onMouseEnter={() => setIsHovering(true)}
diff --git a/frontend/src/index.css b/frontend/src/index.css
index 76ac967..ef1d18a 100644
--- a/frontend/src/index.css
+++ b/frontend/src/index.css
@@ -26,7 +26,6 @@ body {
   display: flex;
   place-items: center;
   min-width: 320px;
-  min-height: 100vh;
   @apply bg-custom-light dark:bg-custom-dark-1;
 }
 
diff --git a/frontend/src/views/TemplateView.jsx b/frontend/src/views/TemplateView.jsx
index 6e9be88..12c24ad 100644
--- a/frontend/src/views/TemplateView.jsx
+++ b/frontend/src/views/TemplateView.jsx
@@ -29,7 +29,8 @@ export const TemplateView = ({ endpoint }) => {
   }, [isSmallScreen]);
 
   return (
-    <div className="flex h-screen w-auto flex-col">
+    <div>
+      <div className="fixed h-screen w-auto flex-col left-0 top-0">
       <Header />
       {isSmallScreen && (
         <div className="mt-8 flex justify-center">
@@ -49,7 +50,10 @@ export const TemplateView = ({ endpoint }) => {
         >
           <TemplateDetails endpoint={endpoint} onSingleInstance={setObjectID} />
         </aside>
-        <main className="flex-1 ">
+        
+      </div>
+    </div>
+      <main className="flex-1 ">
           <div className="html-wrapper ml-8 mt-8 flex h-[80vh] min-w-0 max-w-none items-start justify-center  lg:min-w-[650px] lg:max-w-4xl">
             {!!!objectID && !!!singleObjectID && (
               <p className="text-xl text-gray-700 dark:text-gray-300">
@@ -57,15 +61,16 @@ export const TemplateView = ({ endpoint }) => {
               </p>
             )}
             {(objectID || singleObjectID) && (
-              <InstanceView
-                endpoint={endpoint}
-                objectID={objectID || singleObjectID}
-                templateName={templateName}
-              />
+              <div className=" mx-auto box-border mb-4">
+                <InstanceView
+                  endpoint={endpoint}
+                  objectID={objectID || singleObjectID}
+                  templateName={templateName}
+                />
+              </div>
             )}
           </div>
         </main>
-      </div>
     </div>
   );
 };