{"version":"2.1.284","anchor":"artifact-pages-new-responsive-layout-instruction-text","canonical_anchor":"artifact-pages-new-responsive-layout-instruction-text","heading":"Instructions ask for generated pages to work on phone-sized screens","tier":"notice","area":"Artifacts","url":"https:\/\/changelogs.core-directive.com\/v\/2.1.284\/e\/artifact-pages-new-responsive-layout-instruction-text","release_url":"https:\/\/changelogs.core-directive.com\/v\/2.1.284","markdown":"### Instructions ask for generated pages to work on phone-sized screens\n\nNew instructions tell Claude that pages it generates must work at about 400px wide and never scroll sideways\n\n**Unclear.** It is not clear when these instructions are given to Claude.\n\n**What**\n\nClaude Code now includes new instructions about page layout. They tell Claude that pages it generates must also work at phone width, about 400 pixels across, and that the page must never scroll horizontally. They also call for a 16-pixel margin at the edges, among other layout rules.\n\n**Why**\n\nThese instructions would change the HTML that Claude writes for artifacts, the standalone pages it can create, so that those pages fit small screens.\n\n- Area: Artifacts\n- Tier: You'll notice\n- Useful: 2\/5\n- Signal: 2\/5"}