Skip to content

Commit 8e71f59

Browse files
authored
Update solutions.md
Adding a solution for the task in the box model section.
1 parent 1d59466 commit 8e71f59

File tree

1 file changed

+16
-0
lines changed

1 file changed

+16
-0
lines changed

learn/solutions.md

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -54,6 +54,22 @@ a[href^="https"] {
5454
}
5555
```
5656

57+
## The Box Model
58+
59+
[Task](https://developer.mozilla.org/en-US/docs/User:chrisdavidmills/CSS_Learn/The_Box_Model#Playing_with_box_models)
60+
61+
Task: Change the size of the second box (by adding CSS to the .alternate class) to make it match the first box in width and height.
62+
63+
```
64+
.alternate {
65+
box-sizing: border-box;
66+
width: 390px;
67+
height: 240px;
68+
}
69+
```
70+
71+
You will need to increase the height and width of the second block, to add the size of the padding and border.
72+
5773
## Backgrounds and Borders
5874

5975
To style the box we add a border, using the `border` property. Round the corners with `border-radius` and then add the background image setting the size to `contain`.

0 commit comments

Comments
 (0)