fix: syntax errors (#695)

The PR: - fixes syntax errors - trailing spaces were removed - adds `.prettierignore` files so Prettier can be run -
mdn · Dec 10, 2023 · 1721dd5 · 1721dd5
1 parent 6191b97
commit 1721dd5
Show file tree

Hide file tree

Showing 5 changed files with 101 additions and 73 deletions.
diff --git a/.prettierignore b/.prettierignore
@@ -0,0 +1,6 @@
+# This .prettierignore file uses .gitignore syntax
+# see https://prettier.io/docs/en/ignore.html#ignoring-files-prettierignore
+
+/css/introduction-to-css/debugging-css/style.css
+/html/introduction-to-html/debugging-html/debug-example.html
+/tools-testing/cross-browser-testing/javascript/broken-js-test.js
diff --git a/css/introduction-to-css/fundamental-css-comprehension-finished/index.html b/css/introduction-to-css/fundamental-css-comprehension-finished/index.html
@@ -14,7 +14,7 @@ <h2>Chris Mills</h2>
     </header>
     <article>
       <img src="chris.jpg" alt="A picture of Chris - a man with glasses, a beard, and a silly wooly hat">
-      <p>50 My Street</br>
+      <p>50 My Street<br>
          The Town<br>
          Gray Peach<br>
          UK<br>

diff --git a/...page-finished/original-font-files/Lovato Light-Webfont/Reference/How_to_use_webfonts.html b/...page-finished/original-font-files/Lovato Light-Webfont/Reference/How_to_use_webfonts.html
@@ -15,8 +15,8 @@
 		del, dfn, em, font, img, ins, kbd, q, s, samp,
 		small, strike, strong, sub, sup, tt, var,
 		b, u, i, center, dl, dt, dd, ol, ul, li,
-		fieldset, form, label, legend, table, 
-		caption, tbody, tfoot, thead, tr, th, td 
+		fieldset, form, label, legend, table,
+		caption, tbody, tfoot, thead, tr, th, td
 		                  {margin: 0;padding: 0;border: 0;outline: 0;
 		                  font-size: 100%;vertical-align: baseline;
 		                  background: transparent;}
@@ -29,7 +29,7 @@
 		ins               {text-decoration: none;}
 		del               {text-decoration: line-through;}
 		table             {border-collapse: collapse;border-spacing: 0;}
-		
+
 		/*-- GRID -----*/
 		.section {margin-bottom: 18px;
 		}
@@ -38,7 +38,7 @@
 
 		.section .firstcolumn,
 		.section .firstcol {margin-left: 0;}
-		
+
 		.grid1, .grid1_2cols, .grid1_3cols, .grid1_4cols, .grid2, .grid2_3cols, .grid2_4cols, .grid3, .grid3_2cols, .grid3_4cols, .grid4, .grid4_3cols, .grid5, .grid5_2cols, .grid5_3cols, .grid5_4cols, .grid6, .grid6_4cols, .grid7, .grid7_2cols, .grid7_3cols, .grid7_4cols, .grid8, .grid8_3cols, .grid9, .grid9_2cols, .grid9_4cols, .grid10, .grid10_3cols, .grid10_4cols, .grid11, .grid11_2cols, .grid11_3cols, .grid11_4cols, .grid12
 		{margin-left: 15px;float: left;display: inline; overflow: hidden;}
 		.width5, .grid5, .span-5 {width: 335px;}
@@ -56,7 +56,7 @@
 		.width7_3cols,.grid7_3cols  {width: 148px;}
 		.width7_4cols,.grid7_4cols  {width: 107px;}
 		.input_width7 {width: 469px;}
-		
+
 		/*-- STYLES -----*/
 		body {
 			color: #000;
@@ -84,7 +84,7 @@
 			width: 865px;
 			margin: 0px auto;
 		}
-		
+
 
 
 		#header {
@@ -95,9 +95,9 @@
 			text-indent:-9999px;
 			background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAASoAAABtCAMAAAAhztx9AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAADBQTFRFzen3mNLwDCc17fj8GVRwUbXlLprOrNzyesbrEjtOZb3oJXulP63iAAAA////MqfgopnD5wAABSNJREFUeNrs2u1yqyAQBmBARATU+7/bo6CRTwMp7ZnJvPurjUbrU1gWkGyIyiAgABWoQAUqUIEKASpQgQpUoAIVAlSgAhWoQAUqxJdSCbYsHFQ1MS/Lr1h9IRU7qBZQVVNpUL0PDao2K1BVJ/ZjKORdyb6SSiwLc0VDT6uvohKcMS72H/gyn0VDx7Lhq6hsM2LiyFZ6404KrSobzuawWoQ4pRhyVZnKdj7b/djMO1btX0V197m9UbHe5cJ3jYB7Wj873TwL1FUVw+CR1DEHrMT6jct+59Ke1qD6nwGqn1HpTATJQPN9rGGcR+1caC1y17oOPl/XSDoRQiiV4/2ZumMML6zKh4z/UXLUfTX+iNL93hOl6dmPVGxJwkuUevY+5yJc/WAiLQvZvTSSxnXeSNY7hul6gnUNPvaecA0PEek99/4Bvc8b4qc/vhDQ0qF0l59QiTk6osOFIvYZFQ2ffM1S7UFMnmr1RSKqdTCPVHKIb9KFSqTHeEB1TCvaqWKpItVttZatYqr42UMqmt6jjYqHoQNF96vQ0YpQbqn2RSWuS7kdlStc77NPeuaoUVHiU+3Zy8Vk//uT97w0PERKVK8vZaik07luLvebN1I9zLK8OYPDEcFvoVXaJ3W6oTLF/0qTe+jN2Hw25pqGOS6xyhLVKktUo0Wm4ajQgUokPUz7XfDqY6KV6vhzTe6GIdVmhvv3ODcPd+PJUK2qQDUlkM0jYL4KjiHOdhZR+cNgFVUxP0RUfvOLqeh9KEflD4PeV8ekTXWimjMLsF6XOxDmqOH1pZJlKlWmIiQYOzdyf5VmBsguVGmjCvi0zfjhqNiXSn1GZRMSyVGRJOf3odK5HW6vmLJU0TZcda6SP6SSD1Sun00ZqiFKYz2p2Fsqt1WiW0fAdRrfU9EyFSmndXKWBDKhMvFVPqFifvAHKnE/+Unlii/RQGWGc3ay11DKPFB5HnHJ/VAskPO/caX2m+o4c/gpVa5W59lttZTKlvTnMFhFdVY3V7EsS1Q0X1cZJW3FdeXnHJX1OU8Iqcj/pPJnOHVU8Yw1N0UxzoMUJzavDpalMvcwWKC6Z1H076i8yrSS6pxTkCG0UuWJXlkqT+Va7vQLVNVpXeSoXGWqm6iupOO3HVVePkjmuOP2TOXSGS3nql+nSkfAV7l1WDVTnY805qgGb5T0p8vRkF+gcqlOFkfA0V6LdKNaKqm2M7V/QGUfRaUrC1SV5rw0zM4lqmsYfKyraBeqqmo96JjsI6rp9deq8gzNpzJhDVukOofBx2q9E1XFHDBe6PuEirZS2T57T+XKVNaUPM4BO1FVrCzw6Oyfd8Aaqm3wTyxT3QVccWWhE1XFehWPGdupxjCtV1HJpwVjEo8ZT+tVnagqVkF53GFrqILZn927IVsbVZB0lJ+A4nqchlTJKmgvqvdr6wGVYHVUZJikm/sZ5ZbJZSuV8pY6g2opmbqQ9WFt3U2RulC93bHhaY+toIrryWlrpdq8tmgz1zAVqNwKfdolvehC9XYfkL+tWiuo6NZONXqNka7BYg3JzM2f9gE7Ub3ZXU5qCV1DJQOradw+oHL1pcmtwZPMuPEwV2/ZXY7fUUhaln1nYc69s5B9aSE9S+cmy9S+saDCfSZVeokgefHAvt9gXpOUaXqdl1xhTN5ZGF/vLJimRRgEqEAFKlCBClQIUIEKVKACFahAhQAVqEAFKlCBCgEqUIEKVKACFQJUoAIVqEAFKgSoQAUqUIEKVKBCgApUfx3/BBgAeuw63hnBp0AAAAAASUVORK5CYII=) no-repeat left center;
 			background-color: #31a7e0;
-			
+
 		}
-		
+
 		#main_content {
 			background-color: #fff;
 			padding: 20px 20px 20px;
@@ -120,15 +120,15 @@
 			overflow: auto;
 		}
 
-		.box  { 
-		  padding: 18px; 
-		  margin-bottom: 18px; 
-		  background: #eee; 
+		.box  {
+		  padding: 18px;
+		  margin-bottom: 18px;
+		  background: #eee;
 		}
 		.bottom,.last 	{margin-bottom:0 !important; padding-bottom:0 !important;}
-
 
-
+
+
 		p{
 			line-height: 1.2em;
 			margin-bottom: 18px;
@@ -141,16 +141,16 @@
 			font-size: 15px;
 			margin-top: 18px;
 		}
-		
+
 		.sidebar p{
 			font-size: 12px;
 			line-height: 1.4em;
 		}
-		
+
 	</style>
 
 <title>How to Use Webfonts</title>
-	
+
   </head>
 
 <body>
@@ -162,18 +162,18 @@
 			<div class="section">
 				<div class="grid7 firstcol">
 					<h1>Installing Webfonts</h1>
-					
+
 					<p>Webfonts are supported by all major browser platforms but not all in the same way. There are currently four different font formats that must be included in order to target all browsers. This includes TTF, WOFF, EOT and SVG.</p>
-					
+
 					<h2>1. Upload your webfonts</h2>
 					<p>You must upload your webfont kit to your website. They should be in or near the same directory as your CSS files.</p>
-					
+
 					<h2>2. Include the webfont stylesheet</h2>
 					<p>A special CSS @font-face declaration helps the various browsers select the appropriate font it needs without causing you a bunch of headaches. Learn more about this syntax by reading the <a href="http://www.fontspring.com/blog/further-hardening-of-the-bulletproof-syntax">Fontspring blog post</a> about it. The code for it is as follows:</p>
 
 
 <code>
-@font-face{ 
+@font-face{
 	font-family: 'MyWebFont';
 	src: url('WebFont.eot');
 	src: url('WebFont.eot?#iefix') format('embedded-opentype'),
@@ -192,7 +192,7 @@ <h2>3. Modify your own stylesheet</h2>
 <h2>4. Test</h2>
 <p>Getting webfonts to work cross-browser <em>can</em> be tricky. Use the information in the sidebar to help you if you find that fonts aren't loading in a particular browser.</p>
 				</div>
-				
+
 				<div class="grid5 sidebar">
 					<div class="box">
 						<h2>Troubleshooting<br />Font-Face Problems</h2>
@@ -220,11 +220,10 @@ <h3>Fonts not loading in IE9</h3>
 					</div>
 				</div>
 			</div>
-			
+
 		</div>
-	
+
 	</div>
-
-</div>
+
 </body>
 </html>
diff --git a/html/forms/form-validation/full-example.html b/html/forms/form-validation/full-example.html
@@ -1,8 +1,8 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en-us">
   <head>
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width">
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width" />
     <title>Full built-in validation example</title>
     <style>
       form {
@@ -19,7 +19,7 @@
       input[type="number"],
       textarea,
       fieldset {
-        width : 100%;
+        width: 100%;
         border: 1px solid #333;
         box-sizing: border-box;
       }
@@ -34,53 +34,75 @@
     </style>
   </head>
 
-<body>
-  <form>
-    <p>
+  <body>
+    <form>
       <fieldset>
-        <legend>Do you have a driver's license?<span aria-label="required">*</span></legend>
+        <legend>
+          Do you have a driver's license?<span aria-label="required">*</span>
+        </legend>
         <!-- While only one radio button in a same-named group can be selected at a time,
-             and therefore only one radio button in a same-named group having the "required"
-             attribute suffices in making a selection a requirement -->
-        <input type="radio" required name="driver" id="r1" value="yes"><label for="r1">Yes</label>
-        <input type="radio" required name="driver" id="r2" value="no"><label for="r2">No</label>
+           and therefore only one radio button in a same-named group having the "required"
+           attribute suffices in making a selection a requirement -->
+        <input type="radio" required name="driver" id="r1" value="yes" /><label
+          for="r1"
+          >Yes</label
+        >
+        <input type="radio" required name="driver" id="r2" value="no" /><label
+          for="r2"
+          >No</label
+        >
       </fieldset>
-    </p>
-    <p>
-      <label for="n1">How old are you?</label>
-      <!-- The pattern attribute can act as a fallback for browsers which
+      <p>
+        <label for="n1">How old are you?</label>
+        <!-- The pattern attribute can act as a fallback for browsers which
            don't implement the number input type but support the pattern attribute.
            Please note that browsers that support the pattern attribute will make it
            fail silently when used with a number field.
            Its usage here acts only as a fallback -->
-      <input type="number" min="12" max="120" step="1" id="n1" name="age"
-             pattern="\d+">
-    </p>
-    <p>
-      <label for="t1">What's your favorite fruit?<span aria-label="required">*</span></label>
-      <input type="text" id="t1" name="fruit" list="l1" required
-             pattern="[Bb]anana|[Cc]herry|[Aa]pple|[Ss]trawberry|[Ll]emon|[Oo]range">
-      <datalist id="l1">
-        <option>Banana</option>
-        <option>Cherry</option>
-        <option>Apple</option>
-        <option>Strawberry</option>
-        <option>Lemon</option>
-        <option>Orange</option>
-      </datalist>
-    </p>
-    <p>
-      <label for="t2">What's your e-mail address?</label>
-      <input type="email" id="t2" name="email">
-    </p>
-    <p>
-      <label for="t3">Leave a short message</label>
-      <textarea id="t3" name="msg" maxlength="140" rows="5"></textarea>
-    </p>
-    <p>
-      <button>Submit</button>
-    </p>
-  </form>
-</body>
-
+        <input
+          type="number"
+          min="12"
+          max="120"
+          step="1"
+          id="n1"
+          name="age"
+          pattern="\d+"
+        />
+      </p>
+      <p>
+        <label for="t1"
+          >What's your favorite fruit?<span aria-label="required"
+            >*</span
+          ></label
+        >
+        <input
+          type="text"
+          id="t1"
+          name="fruit"
+          list="l1"
+          required
+          pattern="[Bb]anana|[Cc]herry|[Aa]pple|[Ss]trawberry|[Ll]emon|[Oo]range"
+        />
+        <datalist id="l1">
+          <option>Banana</option>
+          <option>Cherry</option>
+          <option>Apple</option>
+          <option>Strawberry</option>
+          <option>Lemon</option>
+          <option>Orange</option>
+        </datalist>
+      </p>
+      <p>
+        <label for="t2">What's your e-mail address?</label>
+        <input type="email" id="t2" name="email" />
+      </p>
+      <p>
+        <label for="t3">Leave a short message</label>
+        <textarea id="t3" name="msg" maxlength="140" rows="5"></textarea>
+      </p>
+      <p>
+        <button>Submit</button>
+      </p>
+    </form>
+  </body>
 </html>
diff --git a/html/forms/text-example/index.html b/html/forms/text-example/index.html
@@ -38,6 +38,7 @@
                placeholder="lowercase, 4-8 characters"
                pattern="[a-z]{4,8}">
       </div>
+      <div>
         <span class="validity"></span>
       </div>
       <div>