Question 1:

Given this starting code:  

https://caohuutitou-8939.trinket.io/sites/tp1_start-html (Try to add more boxes while resizing the browser, what do you see? is it responsive web?)

Give the change/addition you have to make to the code shown (in the "interactive" boxes above) so that you result looks exactly  like this:

https://caohuutitou-8939.trinket.io/sites/copy-of-tp1_end-html  (resize your browser to see "responsive web").

Give me the change/addition you have made: ___________________________________________________________________________________

Create your URL: http://oldtown.glendon.yorku.ca/~yourlastname/2925/animation and protect it with a username and a password. Tell me what it is so that I can grade your work. Next, display your result as a web page at:

http://oldtown.glendon.yorku.ca/~yourlastname/2925/animation/q1.html


Question 2:

Given this starting code:  

https://trinket.io/html/f21f8a5603

Given the change/addition you have to make to the code shown (in boxes) above to that you result looks exactly  like this:

https://caohuutitou-8939.trinket.io/sites/hw2_001_end-html (resize your browser to see "responsive web").

Give me the change/addition you have made: ___________________________________________________________________________________
Display your result as a web page at:
http://oldtown.glendon.yorku.ca/~yourlastname/2925/animation/q2.html


Question 3:

Given this starting code:   


Give the change/addition you have to make to the code shown above so that you result looks exactly  like this:
https://caohuutitou-8939.trinket.io/sites/q3_b-html  (resize your browser to see "responsive web").

Give me the change/addition you have made: ___________________________________________________________________________________
Display your result as a web page at:
http://oldtown.glendon.yorku.ca/~yourlastname/2925/animation/q3.html


Question 4:

(a) Examine, then embed this URL  https://trinket.io/html/3c14e0a931 (Font size animation)

to your web page at:

http://oldtown.glendon.yorku.ca/~yourlastname/2925/animation/q4-a.html 

(b) Change you code so that your final result looks like this:

https://caohuutitou-8939.trinket.io/sites/tran004-html

Display your result (code) at:  http://oldtown.glendon.yorku.ca/~yourlastname/2925/animation/q4-b.html

---

See also: https://www.w3schools.com/css/css3_transitions.asp


Question 5:

Starting code:

https://trinket.io/html/b4f1cb03e2

Your result should be like this: html

Display your result as a web page at: http://oldtown.glendon.yorku.ca/~yourlastname/2925/animation/q5.html


Question 6:

(a) Given the web page:

https://trinket.io/library/trinkets/171266a60a

Embed it (the trinket link above) at your URL:

http://oldtown.glendon.yorku.ca/~lastname/2635/march/midterm/page1.html

(b) Protect YOUR link in (a) with 3 distinct usernames and passwords.
     Your .htpasswd file should be kept outside of directory WWW, for additional security, and at:
     /home/lastname/2635/march/

(c) By using Avidemux and Audacity, make the video in (a), hcthesun.mp4, play at 92 % tempo.

Display your result (the slower video) at your URL here: http://oldtown.glendon.yorku.ca/~lastname/2635/march/midterm/hcthesun.html


Question 7:

Given the URL: http://oldtown.glendon.yorku.ca/~titou/css/mdn/new1s/box-models.html

(i) Add 2 more boxes with different sizes (use margin or padding)?

(ii) How do you make all the boxes have the SAME size while keeping the different margins and paddings for each box.

Give me the change/addition you have made: ___________________________________________________________________________________

Question 8:

Given this starting code:  

https://trinket.io/html/6fc70faaa4

Given the change/addition you have to make to the code shown (in boxes) above to that you result looks exactly  like this:

https://caohuutitou-8939.trinket.io/sites/copy-of-demo5-html (resize your browser to see "responsive web").

Give me the change/addition you have made: ___________________________________________________________________________________
Display your result as a web page at:
http://oldtown.glendon.yorku.ca/~yourlastname/2925/animation/q9.html

Question 9:

Review:  http://oldtown.glendon.yorku.ca/~titou/css/mdn/flex/_sample_.setting_flex_item_distribution.html


#### End of possible midterm questions.
#### You will hand in a few selected  questions (3) from the questions above.
#### There is a 48-hour deadline (date to be announced) as this is a test.
Other examples:
http://oldtown.glendon.yorku.ca/~titou/css/mdn/flex/_sample_.setting_flex_item_distribution.html
http://oldtown.glendon.yorku.ca/~titou/css/mdn/flex2/center.html
http://oldtown.glendon.yorku.ca/~titou/mdn/march11/go/fonts/sample_examples1.html
https://coryrylan.com/blog/css-gap-space-with-flexbox