20 points
1. Create a new HTML file and save is as mid-practical.html.
2. Copy and paste there the entire code from this file
3. Change some CSS for the boxes:
If you write all codes correctly, your file should look like the picture below.
Part 1 (5 points):
- Position the box 1 in the middle of the browser with margin properties.
- Make the background color #326F63
- Make the text font size 20 pixels and its color white
- Make the distance from the text to the box edges 25 pixels
Part 2 (5 points):
- With the float property, position box 2 and box 3 in one raw
- The distance from the left part of the browser and box 2, as well as between these two boxes is 100 pixels
- Position box 4 under boxes 2 and 3, so it is not floating.
- The distance from the left part of the browser and box 4 is 100 pixels
Part 3 (5 points):
- With the display property, position box 5 and box 6 in one raw
- The distance from the left part of the browser and box 5, as well as between these two boxes is 100 pixels
Part 4 (5 points)
- Hide the box 7 (though invisible, it still has to exist), keeping in mind that the box 8 has the be remained on its own place. You decide how to do that.
Submission: after you finish the test, put it into your dropbox.
