fix(curriculum): remove meta viewport requirement from bookstore page workshop (freeCodeCamp#64944)

AdityaSingh-18 · web-flow · commit 7d58ef2062b4 · 2026-01-02T06:24:24.000-08:00
diff --git a/curriculum/challenges/english/blocks/workshop-bookstore-page/68e97fe79367ad7b5dd6c9cd.md b/curriculum/challenges/english/blocks/workshop-bookstore-page/68e97fe79367ad7b5dd6c9cd.md
@@ -38,7 +38,6 @@ assert.match(code, /<body>[\s\S]*<h1>[\s\S]*<\/h1>[\s\S]*<\/body>/i);
 <html lang="en">
 <head>
   <meta charset="UTF-8" />
-  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <title>XYZ Bookstore Page</title>
 </head>
 --fcc-editable-region--
diff --git a/curriculum/challenges/english/blocks/workshop-bookstore-page/68ebdbacdd3fa474132cc975.md b/curriculum/challenges/english/blocks/workshop-bookstore-page/68ebdbacdd3fa474132cc975.md
@@ -38,7 +38,6 @@ assert.exists(document.querySelector('h1 + p'));
 <html lang="en">
 <head>
   <meta charset="UTF-8" />
-  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <title>XYZ Bookstore Page</title>
 </head>
 
diff --git a/curriculum/challenges/english/blocks/workshop-bookstore-page/68ec6cd5b7e8f5a8f7319e32.md b/curriculum/challenges/english/blocks/workshop-bookstore-page/68ec6cd5b7e8f5a8f7319e32.md
@@ -34,7 +34,6 @@ assert.exists(document.querySelector('p + div'));
 <html lang="en">
 <head>
   <meta charset="UTF-8" />
-  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <title>XYZ Bookstore Page</title>
 </head>
 
diff --git a/curriculum/challenges/english/blocks/workshop-bookstore-page/68ec6d9a315221aa31e54816.md b/curriculum/challenges/english/blocks/workshop-bookstore-page/68ec6d9a315221aa31e54816.md
@@ -40,7 +40,6 @@ assert.equal(document.querySelector('div')?.className, 'card-container');
 <html lang="en">
 <head>
   <meta charset="UTF-8" />
-  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <title>XYZ Bookstore Page</title>
 </head>
 
diff --git a/curriculum/challenges/english/blocks/workshop-bookstore-page/68ec6e8d0caee3afaaf142ef.md b/curriculum/challenges/english/blocks/workshop-bookstore-page/68ec6e8d0caee3afaaf142ef.md
@@ -40,7 +40,6 @@ assert.exists(document.querySelector('.card-container div.card'));
 <html lang="en">
 <head>
   <meta charset="UTF-8" />
-  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <title>XYZ Bookstore Page</title>
 </head>
 
diff --git a/curriculum/challenges/english/blocks/workshop-bookstore-page/68ec9332a9b5b2b32487bd00.md b/curriculum/challenges/english/blocks/workshop-bookstore-page/68ec9332a9b5b2b32487bd00.md
@@ -42,7 +42,6 @@ assert.equal(document.querySelector('.card')?.id, 'sally-adventure-book');
 <html lang="en">
 <head>
   <meta charset="UTF-8" />
-  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <title>XYZ Bookstore Page</title>
 </head>
 
diff --git a/curriculum/challenges/english/blocks/workshop-bookstore-page/68ec98b38d83a3c28dd30efe.md b/curriculum/challenges/english/blocks/workshop-bookstore-page/68ec98b38d83a3c28dd30efe.md
@@ -32,7 +32,6 @@ assert.equal(document.querySelector('.card h2')?.innerText.trim(), "Sally's SciF
 <html lang="en">
 <head>
   <meta charset="UTF-8" />
-  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <title>XYZ Bookstore Page</title>
 </head>
 
diff --git a/curriculum/challenges/english/blocks/workshop-bookstore-page/68ec99e478211dc578699944.md b/curriculum/challenges/english/blocks/workshop-bookstore-page/68ec99e478211dc578699944.md
@@ -41,7 +41,6 @@ assert.exists(document.querySelector('.card h2 + p'));
 <html lang="en">
 <head>
   <meta charset="UTF-8" />
-  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <title>XYZ Bookstore Page</title>
 </head>
 
diff --git a/curriculum/challenges/english/blocks/workshop-bookstore-page/68eca11e99e3c5c894ca9d69.md b/curriculum/challenges/english/blocks/workshop-bookstore-page/68eca11e99e3c5c894ca9d69.md
@@ -45,7 +45,6 @@ assert.equal(document.querySelector('.card button')?.innerText.trim(), 'Buy Now'
 <html lang="en">
 <head>
   <meta charset="UTF-8" />
-  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <title>XYZ Bookstore Page</title>
 </head>
 
diff --git a/curriculum/challenges/english/blocks/workshop-bookstore-page/68eca2a795b333ca5fee30a8.md b/curriculum/challenges/english/blocks/workshop-bookstore-page/68eca2a795b333ca5fee30a8.md
@@ -37,7 +37,6 @@ assert.exists(document.querySelector('.card + .card'));
 <html lang="en">
 <head>
   <meta charset="UTF-8" />
-  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <title>XYZ Bookstore Page</title>
 </head>
 
diff --git a/curriculum/challenges/english/blocks/workshop-bookstore-page/68eca3cfeebef2cd8cc5f814.md b/curriculum/challenges/english/blocks/workshop-bookstore-page/68eca3cfeebef2cd8cc5f814.md
@@ -33,7 +33,6 @@ assert.equal(cards[1]?.id, 'dave-cooking-book');
 <html lang="en">
 <head>
   <meta charset="UTF-8" />
-  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <title>XYZ Bookstore Page</title>
 </head>
 
diff --git a/curriculum/challenges/english/blocks/workshop-bookstore-page/68eca4c4b0f952cf09fabe09.md b/curriculum/challenges/english/blocks/workshop-bookstore-page/68eca4c4b0f952cf09fabe09.md
@@ -33,7 +33,6 @@ assert.equal(cards[1]?.querySelector('h2')?.innerText.trim(), "Dave's Cooking Ad
 <html lang="en">
 <head>
   <meta charset="UTF-8" />
-  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <title>XYZ Bookstore Page</title>
 </head>
 
diff --git a/curriculum/challenges/english/blocks/workshop-bookstore-page/68eca5412b5dd9d06b3d6404.md b/curriculum/challenges/english/blocks/workshop-bookstore-page/68eca5412b5dd9d06b3d6404.md
@@ -44,7 +44,6 @@ assert.exists(cards[1]?.querySelector('h2 + p'));
 <html lang="en">
 <head>
   <meta charset="UTF-8" />
-  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <title>XYZ Bookstore Page</title>
 </head>
 
diff --git a/curriculum/challenges/english/blocks/workshop-bookstore-page/68eca5c0065c82d256d29ca3.md b/curriculum/challenges/english/blocks/workshop-bookstore-page/68eca5c0065c82d256d29ca3.md
@@ -49,7 +49,6 @@ assert.equal(cards[1]?.querySelector('button')?.innerText.trim(), 'Buy Now');
 <html lang="en">
 <head>
   <meta charset="UTF-8" />
-  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <title>XYZ Bookstore Page</title>
 </head>
 
diff --git a/curriculum/challenges/english/blocks/workshop-bookstore-page/68eca6364c5616d393389a30.md b/curriculum/challenges/english/blocks/workshop-bookstore-page/68eca6364c5616d393389a30.md
@@ -50,7 +50,6 @@ assert.exists(document.querySelector('p + .btn-container'));
 <html lang="en">
 <head>
   <meta charset="UTF-8" />
-  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <title>XYZ Bookstore Page</title>
 </head>
 
diff --git a/curriculum/challenges/english/blocks/workshop-bookstore-page/68eca6e5a6759ed4ea0034dc.md b/curriculum/challenges/english/blocks/workshop-bookstore-page/68eca6e5a6759ed4ea0034dc.md
@@ -82,7 +82,6 @@ assert.equal(buttons[1]?.innerText.trim(), 'Checkout');
 <html lang="en">
 <head>
   <meta charset="UTF-8" />
-  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <title>XYZ Bookstore Page</title>
 </head>
 
@@ -118,7 +117,6 @@ assert.equal(buttons[1]?.innerText.trim(), 'Checkout');
 <html lang="en">
 <head>
   <meta charset="UTF-8" />
-  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <title>XYZ Bookstore Page</title>
 </head>
 
diff --git a/curriculum/challenges/english/blocks/workshop-bookstore-page/69134d14150d51f8066a3246.md b/curriculum/challenges/english/blocks/workshop-bookstore-page/69134d14150d51f8066a3246.md
@@ -7,14 +7,11 @@ dashedName: step-3
 
 # --description--
 
-Now, improve the structure of your HTML document to ensure your page is encoded correctly and looks good on all screen sizes.
+Now, improve the structure of your HTML document to ensure your page is encoded correctly.
 
-Add a language attribute to the `html` element and set it to `en`. Then, inside the `head` element add:
+Add a `lang` attribute to the `html` element and set it to `"en"`. Then, inside the `head` element add the `<meta charset="UTF-8">` element.
 
-- a `<meta charset="UTF-8">` tag  
-- a `<meta name="viewport" content="width=device-width, initial-scale=1.0">` tag  
-
-Now add the `body` element below the head section. This is where all of your visible page content will go.
+Lastly, add a `body` element below the `head` section. This is where all of your visible page content will go.
 
 # --hints--
 
@@ -30,12 +27,6 @@ Your code should include a `<meta charset="UTF-8">` element.
 assert.exists(document.querySelector('head > meta[charset="utf-8"]'));
 ```
 
-Your code should include a viewport `meta` element.
-
-```js
-assert.exists(document.querySelector('head > meta[name="viewport"][content="width=device-width, initial-scale=1.0"]'));
-```
-
 Your code should include opening and closing `<body>` tags.
 
 ```js
