no but the result was the same as the solution code. and the instructions also
state any positive value
assuming it should be auto or anything else
The lesson checker may not ‘see’ the result, but is instead reading the code. Change auto to a dimension and see what happens.
I understand now. 
This should work due to the fact that your ‘margin-bottom’ of the teal colored box collapses with your ‘margin-top’ of the purple colored box. Anyways, I recommend you rather have no value for the ‘margin-top’ of the purple colored box and then specify 100px for the teal colored box or vice versa, i.e interchanging the vertical components of the margins of the boxes.
I did the same…
Any positive value…
Yeah, auto would seem the right choice (especially since the arrows cover the full page to the right) but the exercise is not clear…
BUG REPORT: I enter the correct values, as stated in the solution, and the test will not pass me.
I would like to recommend changing the test of the code to include final dimensions on the page instead of code in the stylesheet. Due to margin collapse, any choice in #purple of margin-top: 100px, margin-top: 50px or margin-top: 0; and in the #teal of margin: 100px, margin-bottom: 100px, or margin-bottom: 0; paired with its respective attribute in the sibling selector should return a success.
Explanation:
In #teal, I initially used padding: 0 100px 0 0; which is also technically correct because it does not state that the element should be in the middle, only that it should be 200px wide at the end.
I was quite happy to adjust my code to the solution presented upon “Show Solution” button press since mine was convoluted, but when I reset the lesson, dumped the cache, refreshed the page, etc, I typed it in exactly as the ‘solution’ showed and it still will not allow me to pass by without hitting “Show Solution” again.
Thank you
3 Likes
I got this illustration very well and to mean that given the height and width of the box, the padding adds to the size of the elements. What I see in the diagram above is like the padding made the size where the element will be smaller and I ask, how is it then adding to the size of the element rather than shrinking it from the entire size of the box?
Number two, The solution to the exercise is kind of ok considering the deductions made from the given height and width to arrive at (0 50)px. What I don’t understand is why adding more figures add to the element size rather than reduce it. Thanks for your time.
Your last paragraph also happened to me. Some bug may be in the system.