fixed errors and added all solutions up to the end of 04_css

web · Sep 19, 2020 · e4321b034e0a353bc0fbac2a071f8257b89d496b · e4321b0
1 parent c2c0cc9
commit e4321b034e0a353bc0fbac2a071f8257b89d496b
Show file tree

Hide file tree

Showing 41 changed files with 731 additions and 436 deletions.
diff --git a/04 CSS3.md b/04 CSS3.md
diff --git a/exercises/03_html/02_lists/computers80.html b/exercises/03_html/02_lists/computers80.html
@@ -1,11 +1,10 @@
 <!DOCTYPE html>
-<html lang="en">
 
+<html lang="en">
 <head>
     <title>1980s' home computers</title>
-    <meta charset="UTF-8" />
+    <meta charset="utf-8">
 </head>
-
 <body>
     <figure>
         <img src="computer.png" alt="A computer with a monitor"> </img>
@@ -28,5 +27,4 @@
         <p>The hardware charateristics of a home computer could be defined by its graphics and sound capabilities, CPU, and amount of memory.</p>
     </article>
 </body>
-
 </html>
diff --git a/exercises/03_html/03_hypermedia/views/commodore64.html b/exercises/03_html/03_hypermedia/views/commodore64.html
@@ -1,10 +1,9 @@
 <!DOCTYPE html>
-<html lang="en">
 
+<html lang="en">
 <head>
     <title>Commodore 64</title>
 </head>
-
 <body>
 
 </body>

diff --git a/exercises/04_css/01_formatting/html/hello-world.html b/exercises/04_css/01_formatting/html/hello-world.html
diff --git a/exercises/04_css/01_formatting/html/hello.html b/exercises/04_css/01_formatting/html/hello.html
diff --git a/exercises/04_css/01_formatting/html/targets.html b/exercises/04_css/01_formatting/html/targets.html
diff --git a/exercises/04_css/01_formatting/public/css/hello.css b/exercises/04_css/01_formatting/public/css/hello.css
@@ -1,4 +1,3 @@
-
 h1 {
-  color: red;
+    color: red;
 }
diff --git a/exercises/04_css/01_formatting/public/css/selectors.css b/exercises/04_css/01_formatting/public/css/selectors.css
@@ -1,5 +1,5 @@
 body {
-    font-family: Arial, Verdana, sans-serif;
+    font-family: Arial, Helvetica, sans-serif;
 }
 
 p {

diff --git a/exercises/04_css/01_formatting/public/css/simple.css b/exercises/04_css/01_formatting/public/css/simple.css
diff --git a/exercises/04_css/01_formatting/public/css/targetstyles.css b/exercises/04_css/01_formatting/public/css/targetstyles.css
@@ -1,3 +1,3 @@
 body {
-    font-family: Arial, Verdana, sans-serif;
+    font-family: Arial, Helvetica, sans-serif;
 }
diff --git a/exercises/04_css/01_formatting/views/comparison.html b/exercises/04_css/01_formatting/views/comparison.html
@@ -1,11 +1,10 @@
 <!DOCTYPE html>
-<html lang="en">
 
+<html lang="en">
 <head>
     <title>Comparison of three computers</title>
-    <meta charset="UTF-8" />
+    <meta charset="utf-8">
 </head>
-
 <body>
     <p>A comparison of technical data of three popular 80's home computers:</p>
 
@@ -21,28 +20,24 @@
         </thead>
         <tbody>
             <tr>
-                <td>CPU</td>
+                <th>CPU</th>
                 <td>MOS Technology 6510</td>
                 <td>Zilog Z80</td>
                 <td>MOS Technology 6502</td>
             </tr>
             <tr>
-                <td>RAM</td>
+                <th>RAM</th>
                 <td>64 kilobytes</td>
                 <td>16 or 64 kilobytes</td>
                 <td>5 kilobytes</td>
             </tr>
             <tr>
-                <td>ROM</td>
+                <th>ROM</th>
                 <td>20 kilobytes</td>
                 <td>16 kilobytes</td>
                 <td>16 kilobytes</td>
             </tr>
         </tbody>
     </table>
-
-    <hr/>
-
 </body>
-
 </html>
diff --git a/exercises/04_css/01_formatting/views/csstest.html b/exercises/04_css/01_formatting/views/csstest.html
@@ -1,18 +1,18 @@
-
 <!DOCTYPE html>
-<html>
+
+<html lang="en">
 <head>
     <title>Vintage Home Computers</title>
-    <meta charset="utf-8" />
+    <meta charset="utf-8">
 </head>
 <body>
     <article>
     <h1>1980's Home Computers</h1>
     <p>In early 1980's, home computers became mainstream. For the first time, computers could be
         purchased by an average family household.</p>
      <figure>    
-        <img src="images/computer.png" alt="A computer with a monitor"/>
-         <figcaption>Photo: Piotr Siedlecki, public domain via <a href="http://www.publicdomainpictures.net">http://www.publicdomainpictures.net</a>.</figcaption>
+        <img src="images/computer.png" alt="A computer with a monitor">
+        <figcaption>Photo: Piotr Siedlecki, public domain via <a href="http://www.publicdomainpictures.net">http://www.publicdomainpictures.net</a>.</figcaption>
     </figure> 
     <h2>Novel uses</h2>
     <p>The main usage for a home computer was, of course, games. As cool games may not be a valid reason for purchasing an expensive gadget,
@@ -47,10 +47,7 @@
     </dl>
     </article>
 
-
-    <hr />
+    <hr>
     <p>Disclaimer: <em>All opinions in this page reflect the views of their author(s), not the organization.</em></p>      
-
 </body>
-</html>
-
+</html>
diff --git a/exercises/04_css/01_formatting/views/hello-world.html b/exercises/04_css/01_formatting/views/hello-world.html
diff --git a/exercises/04_css/01_formatting/views/hello.html b/exercises/04_css/01_formatting/views/hello.html
@@ -1,16 +1,15 @@
-
-<!doctype html>
+<!DOCTYPE html>
 
 <html lang="en">
-	<head>
-		<meta charset="utf-8">
-		<title>Let's see CSS at Work</title>
-		<meta name="description" content="The HTML5 Template">
-    <meta name="author" content="Joe Bloggs">
-    <link href="css/hello.css" type="text/css" rel="stylesheet" />
-	</head>
-	<body>
-    <h1>Hello CSS!</h1>
-    <p>Use this file to see how CSS can be used to change the appearance of a web page.</p>
-	</body>
+<head>
+	<title>Let's see CSS at Work</title>
+	<meta charset="utf-8">
+	<meta name="description" content="The HTML5 Template">
+	<meta name="author" content="Joe Bloggs">
+	<link href="css/hello.css" type="text/css" rel="stylesheet">
+</head>
+<body>
+	<h1>Hello CSS!</h1>
+	<p>Use this file to see how CSS can be used to change the appearance of a web page.</p>
+</body>
 </html>
diff --git a/exercises/04_css/01_formatting/views/selectors.html b/exercises/04_css/01_formatting/views/selectors.html
@@ -1,9 +1,10 @@
 <!DOCTYPE html>
-<html>
+
+<html lang="en">
 <head>
     <title>Selectors</title>    
-    <link href="css/selectors.css" type="text/css" rel="stylesheet" />
-    <meta charset="utf-8" />
+    <meta charset="utf-8">
+    <link href="css/selectors.css" type="text/css" rel="stylesheet">
 </head>
 <body>
     <h1 class="alert">Classes and identifiers.</h1>
@@ -17,6 +18,5 @@
     <p id="unique">This paragraph should be uniquely formatted. It is assigned an identifier.</p>
 
     <p class="alert">This paragraph is in 'alert' class, too.</p>
-
 </body>
 </html>
diff --git a/exercises/04_css/01_formatting/views/targets.html b/exercises/04_css/01_formatting/views/targets.html
@@ -1,40 +1,35 @@
 <!DOCTYPE html>
-<html>
+
+<html lang="en">
 <head>
     <title>Selecting elements</title>
-    <link href="css/targetstyles.css" type="text/css" rel="stylesheet" />
-    <meta charset="utf-8" />
+    <meta charset="utf-8">
+    <link href="css/targetstyles.css" type="text/css" rel="stylesheet">
 </head>
 <body>
-
     <h1>Element selection demo</h1>
-
     <p>The sources of energy are:</p>
     <ol>
         <li>protein</li>
         <li>carbohydrates</li>
         <li>fat</li>
     </ol>
-
     <p>Sources of carbohydrates:</p>
     <ul>
         <li>Fruits and berries</li>
         <li>Wheat and pasta</li>
         <li>Sweet products
             <ul>
-                <li>Candies<ul>
-                    <li>Jelly beans</li>
-                    <li>Irish toffee</li>
-                    <li>Fruit drops</li>
-
-                    </ul></li>
-
+                <li>Candies
+                    <ul>
+                        <li>Jelly beans</li>
+                        <li>Irish toffee</li>
+                        <li>Fruit drops</li>
+                    </ul>
+                </li>
                 <li>Pastries</li>
             </ul>
         </li>
-
     </ul>
-
-
 </body>
 </html>
diff --git a/exercises/04_css/02_layout/public/css/floatstyles.css b/exercises/04_css/02_layout/public/css/floatstyles.css
@@ -1,10 +1,4 @@
-
 body {
-    font-family: Arial, Verdana, sans-serif;
+    font-family: Arial, Helvetica, sans-serif;
     margin-left: 200px;
-}
-
-
-
-
-
+}
diff --git a/exercises/04_css/02_layout/public/css/menustyles.css b/exercises/04_css/02_layout/public/css/menustyles.css
@@ -1,7 +1,5 @@
-
-
 body {
-    font-family: Arial, Verdana, sans-serif;
+    font-family: Arial, Helvetica, sans-serif;
 }
 
 nav ul {