RESOLVED: Just solved it by updating Chrome. 
Hello All! 
Here is the link to the article lesson I’m struggling in:
https://www.codecademy.com/courses/learn-css/articles/f1-devtools-box-model
For context, I am not new to this entirely. I used to view source in the dinosaur days of the internet and am familiar with what the lesson is explaining. However I am having an interaction that isn’t as expected.
In the current lesson, I am learning to use Google DevTools. I clicked F12 and opened the elements section as instructed, and as expected, have a neat and tidy website on the left and the code on the right. Then the next step told me to hover over different elements in the code and that it would highlight that element on the website so I could see exactly what element is where on the viewable site and in the code. However, any website I go to, the entire site is highlighted no matter where in the code I select. I’ve tried nearly a dozen websites, including the Codecademy Wiki page they use in the example. I also watched the video on YouTube that is given and the website she brings up.
Is there some setting on my computer or network causing this? It appears that the entire page of any site is treated as the content element of one box. It highlights the entire site, and if I click padding, borders, etc nothing shows. If I try specific elements in the html, like a button, the entire website is highlight again, not the element.
Anyone have ideas what is going on? I don’t need ELI5 but if you could simplify your explanation a bit it would help as I am new to refreshing HTML and CSS after a long time not using it.
Editing to add: I am using Chrome as my browser because the lesson is Google DevTools. I’m on Windows 11. Updating Chrome, but not sure that would matter with this.