Learn Basic CSS by Building a piano - Step 10 -> inheritance

Hi all!
This step says to set box-sizing (border-box) to inherit at html tag level.
I thought it is inherited automatically to all boxes on the whole page? I wonder because in “Building a Cat photo gallery - Step 7” we set border-box as well without explicitly inheriting it.
Actually in the cat gallery it does not have any effect, if you delete this tag nothing changes.
Have not finished piano-app so far, but wonder if box-sizing set at html or * -level is not inherited anyway.
link: https://www.freecodecamp.org/learn/2022/responsive-web-design/learn-responsive-web-design-by-building-a-piano/step-10
cat gallery: https://www.freecodecamp.org/learn/2022/responsive-web-design/learn-css-flexbox-by-building-a-photo-gallery/step-7
Thank you!

Can you link to the step so people have context for the question? Thanks!

Investigated further: if you attach box-sizing: border-box to * , then it works directly for all containers. That is how it was set in cat gallery.
If you attach it to html-tag it is not inherited, then you need to set inheritance for box-sizing to *.
Makes no sense, you could set box-sizting globally for * ant thats it.

perhaps reading through these articles would help you find an answer

happy reading :slight_smile:

Thanks for all the links! :nerd_face:

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.