The main layout of your site might be improperly structured, requiring the use of an auto-layout configuration. Ensure your page is set up correctly by following the guidelines provided in the “My Page” section of the Jet UI Design System.
Components have been extensively modified, which might affect their responsiveness. Watch this video to understand how modifications can impact responsiveness:
Please note, detaching components from the default Codejet setup will result in them no longer adhering to the Jet UI Design System Theme Styles and can’t be converted nicely to code.
Recommendations for section layouts were not utilized. For guidelines on how to properly layout sections for responsiveness, watch this tutorial:
Can’t find what you’re looking for? Join our Discord for additional support!
Was this page helpful?
{"docsConfig":{"$schema":"https://mintlify.com/docs.json","theme":"mint","name":"Codejet","colors":{"primary":"#FF4900","light":"#FF4900","dark":"#FF4900"},"favicon":"/favicon.svg","logo":{"light":"https://mintlify.s3-us-west-1.amazonaws.com/codejet/logo/light.svg","dark":"https://mintlify.s3-us-west-1.amazonaws.com/codejet/logo/dark.svg","href":"https://codejet.ai/"},"navbar":{"links":[{"label":"Book a demo","href":"https://calendly.com/codejet/demo"}],"primary":{"type":"button","label":"Get Started","href":"https://app.codejet.ai/"}},"footer":{"socials":{"x":"https://twitter.com/Codejetai","github":"https://github.com/codejet-ai","linkedin":"https://www.linkedin.com/company/codejetai/"}},"integrations":{"ga4":{"measurementId":"G-NEGEDQ13JD"}},"navigation":{"pages":[]}},"deployment":{"deploymentMetadataValue":{"subdomain":"codejet","hasAudioNarration":false,"actualSubdomain":"codejet","customDomains":["docs.codejet.ai"],"gitSource":{"type":"github","owner":"mysite-ai","repo":"docs","deployBranch":"main","contentDirectory":"","isPrivate":true,"mountPath":"","label":""},"chroma":{"liveDeploymentHistoryId":"6a21a65f1046338ede198778","collectionId":"240fe4ba-5247-4605-ac3d-6d35756901a0","schemaVersion":"v2"},"feedback":{"thumbs":true,"edits":true},"entitlements":{},"buildId":"6ae91fb3477957d7c8b9a946:success","clientVersion":"0.0.4071","searchFilterCounts":[{"language":"default","tag":"Documentation","count":8},{"language":"default","tag":"Knowledge Base","count":8},{"language":"default","tag":"Tools","count":4},{"language":"default","tag":"About","count":2},{"language":"default","tag":"Get Started","count":2}]},"assistantConfig":{},"basePath":"","hasChatPermissions":false,"hasWebMcpPermissions":false,"toggles":[{"name":"kill-isr","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"agent-mintlify-slack","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"agent-integrations-settings","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"rbac-expansion","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"automations-pr-grouping","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"custom-prefix","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"analytics-v7","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"user-flows-analytics","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"no-publish-flow","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"workos-onboarding","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"llms-txt-v2","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"snapshot-serving-live","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"stripTemperatureMiddleware","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"support-platform-pylon-zendesk","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"snapshot-serving","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"instant-rollback","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"granular-notifications-server","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"granular-notifications","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"automations-fable","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"fixed-ai-action-pricing","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"automation-resolve-merge-conflict","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"scoped-publishing","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"mintql","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"page-level-analytics","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"editor-version-history-v2","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"billing-page-v2","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"full-page-search","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"workspace-projects","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"assistant-v5","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"fork-pr-previews","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"revalidation-jwt","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"vite-origin","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"workos-sso-scim","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"hobby-abuse-scan","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"dashboard-inbox","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"workos-signup","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"turbopuffer-dual-write","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"workos-enabled","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"approve-review-flow","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"sso-setup-deadline-banner","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"turbopuffer-serve","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"live-agents","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false}],"googleFontsInlined":false},"customCss":[],"page":{"pagePath":"knowledge-base/why-is-my-page-not-responsive","slug":"/knowledge-base/why-is-my-page-not-responsive","pageMetadata":{"title":"Why is my page not responsive?","description":"Understanding the common issues that affect page responsiveness","href":"/knowledge-base/why-is-my-page-not-responsive"},"description":{"compiledSource":"\"use strict\";\nconst {jsx: _jsx} = arguments[0];\nconst {useMDXComponents: _provideComponents} = arguments[0];\nfunction _createMdxContent(props) {\n const _components = {\n p: \"p\",\n ..._provideComponents(),\n ...props.components\n };\n return _jsx(_components.p, {\n children: \"Understanding the common issues that affect page responsiveness\"\n });\n}\nfunction MDXContent(props = {}) {\n const {wrapper: MDXLayout} = {\n ..._provideComponents(),\n ...props.components\n };\n return MDXLayout ? _jsx(MDXLayout, {\n ...props,\n children: _jsx(_createMdxContent, {\n ...props\n })\n }) : _createMdxContent(props);\n}\nreturn {\n default: MDXContent\n};\n","frontmatter":{},"scope":{}},"pageType":"default","mdx":{"mdxSource":{"compiledSource":"\"use strict\";const{Fragment:_Fragment,jsx:_jsx,jsxs:_jsxs}=arguments[0];const{useMDXComponents:_provideComponents}=arguments[0];function _createMdxContent(props){const _components={a:`a`,em:`em`,p:`p`,..._provideComponents(),...props.components},{Frame,Heading,OptimizedFrame,OptimizedImage,Tip}=_components;if(!Frame)_missingMdxReference(`Frame`,true);if(!Heading)_missingMdxReference(`Heading`,true);if(!OptimizedFrame)_missingMdxReference(`OptimizedFrame`,true);if(!OptimizedImage)_missingMdxReference(`OptimizedImage`,true);if(!Tip)_missingMdxReference(`Tip`,true);return _jsxs(_Fragment,{children:[_jsx(Heading,{level:`2`,id:`introduction`,children:`Introduction`}),`\n`,_jsx(_components.p,{children:`If your web page is not displaying correctly on different devices, here are three common reasons that might be causing the issue:`}),`\n`,_jsx(Heading,{level:`2`,id:`main-layout-misconfiguration`,children:`Main Layout Misconfiguration`}),`\n`,_jsx(_components.p,{children:`The main layout of your site might be improperly structured, requiring the use of an auto-layout configuration. Ensure your page is set up correctly by following the guidelines provided in the “My Page” section of the Jet UI Design System.`}),`\n`,_jsx(Frame,{type:`glass`,children:_jsx(OptimizedImage,{src:`https://codejetphotos.s3.eu-north-1.amazonaws.com/images/knowledge-base/why-is-my-page-not-responsive-1.gif`})}),`\n`,_jsx(Heading,{level:`2`,id:`modified-components`,children:`Modified Components`}),`\n`,_jsx(_components.p,{children:`Components have been extensively modified, which might affect their responsiveness. Watch this video to understand how modifications can impact responsiveness:`}),`\n`,_jsx(Frame,{type:`glass`,children:_jsx(OptimizedFrame,{width:`560`,height:`415`,src:`https://www.youtube.com/embed/JfKPacWVxjY?si=VKPQ8tp3ikVvnW1y`,title:`YouTube video player`,frameBorder:`0`,allow:`accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture`,allowFullScreen:true,style:{width:`100%`}})}),`\n`,_jsx(Tip,{children:_jsx(_components.p,{children:`Please note, detaching components from the default Codejet setup will result in them no longer adhering to the Jet UI Design System Theme Styles and can’t be converted nicely to code.`})}),`\n`,_jsx(Heading,{level:`2`,id:`section-layout-recommendations-not-followed`,children:`Section Layout Recommendations Not Followed`}),`\n`,_jsx(_components.p,{children:`Recommendations for section layouts were not utilized. For guidelines on how to properly layout sections for responsiveness, watch this tutorial:`}),`\n`,_jsx(Frame,{type:`glass`,children:_jsx(OptimizedFrame,{width:`560`,height:`415`,src:`https://www.youtube.com/embed/d7wX08TUXe8?si=OfM2bqPITsv8CKjb`,title:`YouTube video player`,frameBorder:`0`,allow:`accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture`,allowFullScreen:true,style:{width:`100%`}})}),`\n`,_jsx(_components.p,{children:_jsxs(_components.em,{children:[`Can’t find what you’re looking for? `,_jsx(_components.a,{href:`https://discord.gg/XHwhKVAQM9`,children:`Join our Discord`}),` for additional support!`]})})]})}function MDXContent(props={}){const{wrapper:MDXLayout}={..._provideComponents(),...props.components};return MDXLayout?_jsx(MDXLayout,{...props,children:_jsx(_createMdxContent,{...props})}):_createMdxContent(props)}return{default:MDXContent};function _missingMdxReference(id,component){throw new Error(`Expected `+(component?`component`:`object`)+\" `\"+id+\"` to be defined: you likely forgot to import, pass, or provide it.\")}","frontmatter":{},"scope":{"config":{},"pageMetadata":{"title":"Why is my page not responsive?","description":"Understanding the common issues that affect page responsiveness","href":"/knowledge-base/why-is-my-page-not-responsive"}}},"mdxSourceWithNoJs":null},"mdxExtracts":{"tableOfContents":[{"title":"Introduction","slug":"introduction","depth":2,"children":[]},{"title":"Main Layout Misconfiguration","slug":"main-layout-misconfiguration","depth":2,"children":[]},{"title":"Modified Components","slug":"modified-components","depth":2,"children":[]},{"title":"Section Layout Recommendations Not Followed","slug":"section-layout-recommendations-not-followed","depth":2,"children":[]}],"codeExamples":{}},"jsLinks":[],"subdomain":"codejet","siteName":"Codejet","title":"Why is my page not responsive? - Codejet","navMaps":{"firstHrefInVersion":{},"firstHrefInLanguage":{}},"originalFileLocation":"knowledge-base/why-is-my-page-not-responsive.mdx"},"headHtml":"\u003cscript data-mint-head>(function(){var d=document.documentElement,p=null;if(!p){try{p=localStorage.getItem(\"isDarkMode\")}catch(e){}if(p==='true')p='dark';else if(p==='false')p='light';if(p!=='light'\u0026\u0026p!=='dark'\u0026\u0026p!=='system')p=\"system\"}var r=p==='system'?(matchMedia(\"(prefers-color-scheme: dark)\").matches?'dark':'light'):p;d.classList.remove(r==='dark'?'light':'dark');d.classList.add(r);d.setAttribute(\"data-theme-preference\",p)})();\u003c/script>\u003cmeta data-mint-head name=\"description\" content=\"Understanding the common issues that affect page responsiveness\">\u003cmeta data-mint-head name=\"application-name\" content=\"Codejet\">\u003cmeta data-mint-head name=\"generator\" content=\"Mintlify\">\u003clink data-mint-head rel=\"apple-touch-icon\" type=\"image/png\" sizes=\"180x180\" href=\"https://mintlify.s3.us-west-1.amazonaws.com/codejet/_generated/favicon/apple-touch-icon.png?v=3\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"32x32\" href=\"https://mintlify.s3.us-west-1.amazonaws.com/codejet/_generated/favicon/favicon-32x32.png?v=3\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"16x16\" href=\"https://mintlify.s3.us-west-1.amazonaws.com/codejet/_generated/favicon/favicon-16x16.png?v=3\">\u003clink data-mint-head rel=\"shortcut icon\" type=\"image/x-icon\" href=\"https://mintlify.s3.us-west-1.amazonaws.com/codejet/_generated/favicon/favicon.ico?v=3\">\u003cmeta data-mint-head property=\"og:title\" content=\"Why is my page not responsive? - Codejet\">\u003cmeta data-mint-head property=\"og:description\" content=\"Understanding the common issues that affect page responsiveness\">\u003cmeta data-mint-head property=\"og:site_name\" content=\"Codejet\">\u003cmeta data-mint-head property=\"og:url\" content=\"https://docs.codejet.ai/knowledge-base/why-is-my-page-not-responsive\">\u003cmeta data-mint-head property=\"og:type\" content=\"website\">\u003cmeta data-mint-head property=\"og:image\" content=\"https://codejet.mintlify.app/_mintlify/api/og/v2?division=Knowledge+Base\u0026amp;title=Why+is+my+page+not+responsive%3F\u0026amp;description=Understanding+the+common+issues+that+affect+page+responsiveness\u0026amp;theme=c1f594c3c9b7b57054334d4f\u0026amp;signature=82fc466e55a5580affd2946f144b07d6cdbf06e8162f4320f9eb68239a6b3775\">\u003cmeta data-mint-head property=\"og:image:width\" content=\"1200\">\u003cmeta data-mint-head property=\"og:image:height\" content=\"630\">\u003cmeta data-mint-head name=\"twitter:card\" content=\"summary_large_image\">\u003cmeta data-mint-head name=\"twitter:title\" content=\"Why is my page not responsive? - Codejet\">\u003cmeta data-mint-head name=\"twitter:description\" content=\"Understanding the common issues that affect page responsiveness\">\u003cmeta data-mint-head name=\"twitter:image\" content=\"https://codejet.mintlify.app/_mintlify/api/og/v2?division=Knowledge+Base\u0026amp;title=Why+is+my+page+not+responsive%3F\u0026amp;description=Understanding+the+common+issues+that+affect+page+responsiveness\u0026amp;theme=c1f594c3c9b7b57054334d4f\u0026amp;signature=82fc466e55a5580affd2946f144b07d6cdbf06e8162f4320f9eb68239a6b3775\">\u003cmeta data-mint-head name=\"twitter:image:width\" content=\"1200\">\u003cmeta data-mint-head name=\"twitter:image:height\" content=\"630\">\u003cmeta data-mint-head name=\"msapplication-config\" content=\"https://mintlify.s3.us-west-1.amazonaws.com/codejet/_generated/favicon/browserconfig.xml?v=3\">\u003cmeta data-mint-head name=\"apple-mobile-web-app-title\" content=\"Codejet\">\u003cmeta data-mint-head name=\"msapplication-TileColor\" content=\"#FF4900\">\u003clink data-mint-head rel=\"canonical\" href=\"https://docs.codejet.ai/knowledge-base/why-is-my-page-not-responsive\">\u003clink data-mint-head rel=\"alternate\" type=\"application/xml\" href=\"/sitemap.xml\">\u003clink data-mint-head rel=\"alternate\" type=\"text/markdown\" href=\"/knowledge-base/why-is-my-page-not-responsive.md\">\u003cscript data-mint-head type=\"application/ld+json\">{\"@context\":\"https://schema.org\",\"@graph\":[{\"@type\":\"Organization\",\"@id\":\"https://docs.codejet.ai/#organization\",\"name\":\"Codejet\",\"url\":\"https://docs.codejet.ai\",\"logo\":{\"@type\":\"ImageObject\",\"url\":\"https://mintlify.s3-us-west-1.amazonaws.com/codejet/logo/light.svg\"}},{\"@type\":\"WebSite\",\"@id\":\"https://docs.codejet.ai#website\",\"name\":\"Codejet\",\"url\":\"https://docs.codejet.ai\",\"publisher\":{\"@id\":\"https://docs.codejet.ai/#organization\"}},{\"@type\":\"WebPage\",\"@id\":\"https://docs.codejet.ai/knowledge-base/why-is-my-page-not-responsive#webpage\",\"url\":\"https://docs.codejet.ai/knowledge-base/why-is-my-page-not-responsive\",\"name\":\"Why is my page not responsive?\",\"description\":\"Understanding the common issues that affect page responsiveness\",\"isPartOf\":{\"@id\":\"https://docs.codejet.ai#website\"},\"breadcrumb\":{\"@id\":\"https://docs.codejet.ai/knowledge-base/why-is-my-page-not-responsive#breadcrumb\"}},{\"@type\":\"BreadcrumbList\",\"@id\":\"https://docs.codejet.ai/knowledge-base/why-is-my-page-not-responsive#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Knowledge Base\",\"item\":\"https://docs.codejet.ai/knowledge-base/introduction\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Why is my page not responsive?\",\"item\":\"https://docs.codejet.ai/knowledge-base/why-is-my-page-not-responsive\"}]},{\"@type\":[\"Article\",\"TechArticle\"],\"@id\":\"https://docs.codejet.ai/knowledge-base/why-is-my-page-not-responsive#article\",\"headline\":\"Why is my page not responsive?\",\"name\":\"Why is my page not responsive?\",\"description\":\"Understanding the common issues that affect page responsiveness\",\"url\":\"https://docs.codejet.ai/knowledge-base/why-is-my-page-not-responsive\",\"mainEntityOfPage\":{\"@id\":\"https://docs.codejet.ai/knowledge-base/why-is-my-page-not-responsive#webpage\"},\"publisher\":{\"@id\":\"https://docs.codejet.ai/#organization\"},\"isPartOf\":{\"@id\":\"https://docs.codejet.ai#website\"}}]}\u003c/script>\u003cscript data-mint-head type=\"application/ld+json\">{\"@context\":\"https://schema.org\",\"@type\":\"WebSite\",\"name\":\"Codejet\",\"creator\":{\"@type\":\"Organization\",\"name\":\"Mintlify\",\"url\":\"https://mintlify.com\"}}\u003c/script>","siteName":"Codejet","nav":{"global":null,"anchors":[{"anchor":"Documentation","icon":"book-open","pages":[{"title":"Documentation","href":"/introduction"}]},{"anchor":"Knowledge Base","icon":"books","groups":[{"group":"Knowledge Base","pages":[{"title":"Introduction","description":"A collection of answers to frequently asked questions.","href":"/knowledge-base/introduction"},{"title":"Why is my page not responsive?","href":"/knowledge-base/why-is-my-page-not-responsive"},{"title":"How to add custom code to my project?","description":"Add custom code to your website to personalise your project","href":"/knowledge-base/how-to-add-custom-code"},{"title":"How to setup a custom domain?","href":"/knowledge-base/how-to-setup-a-custom-domain"}]}]},{"anchor":"Video tutorials","href":"https://www.youtube.com/@codejetai","icon":"video"},{"anchor":"Community","href":"https://discord.gg/XHwhKVAQM9","icon":"discord"}]},"basePath":"","title":"Why is my page not responsive? - Codejet","buildId":"dpl_GZsjphRpnhWkstV12jxWNcMHFyox","deploymentId":"dpl_GZsjphRpnhWkstV12jxWNcMHFyox","dynamics":["07c022d89b","a74be98ba7"],"chunks":["Frame-BJc2v2A3.js","DynamicMarkdown-CWvhfcZc.js","zoom-image-lightbox-CAita2ok.js","lightbox-handle-r17bVUz3.js"]}
