Assessment Requested for Skill Test: CSS Sizing

MDN Learn
1

Task
I would like to have an assessment on the tasks mentioned in this page:

My Code - Task 1
Source Code: mdnassessments/sizing/task1.html at main · mariaringes/mdnassessments · GitHub
Deployed Code: Sizing Task 1: height and min-height

My Code - Task 2
Source Code: mdnassessments/sizing/task2.html at main · mariaringes/mdnassessments · GitHub
Deployed Code: Sizing Task 2: Percentages

My Code - Task 3
Source Code: mdnassessments/sizing/task3.html at main · mariaringes/mdnassessments · GitHub
Deployed Code: Sizing Task 3: maximum width and images

2

For task 1:

However, the content should not overflow if there is more content than fits in 100 pixels.

You hide the overflow, but technically it still overflows. (We just can’t see it.) What the task ask for is that the box should grow when more text is added. How to solve this problem?

Tasks 2 and 3 are correct.

Michael

3

I have just changed the height value to be initial and added min-height: 100px. This will allow the box to expand as text is added, however will not allow the box to have a height smaller than 100px.

1 Like
4

Yes, that’s correct. You can even remove height: initial; since we never set height before. It already is set to its initial value by definition.