Hi forum fans.
A question from a novice.
I see videos where inspecting page elements in preview and on live pages can help pin down errors, classes and settings.
I can start to understand the how and why, but I’m not sure on what I’m looking at!
Is there any guidance out there.
I have a few issues to tidy up and when I isolate the area in inspector, there seem to be so many sections highlighted it’s confusing for a simple soul like me!
I’m keen to learn though.
1 Like
no help from my site, but having the same issue… this soul is suffering with you 
1 Like
Hi @apswoodwork
Maybe this helps?
Basically the inspector (if we are talking about the browser inspector tool or console) will have 2 main sections in the „elements“ tab you will want to be looking at mostly
One is the HTML (the Elements) and next to it, usually on the right, is the css.
When you click inside the elements on a certain tag (a div for example) most browsers will highlight / expose the actual visible „things“ it produces in the browser and it will do the same when you Click on a Class in the css editor next to it.
This is just a visual reference to see where these things appear or are used on the site
You can then either find classes, ID and css rules or even live edit things so to quickly for example test a new color or padding etc
Next to the elements tab is the next most important tab which is the „console“ itself and logs JavaScript errors (and also lets you live add JavaScript to it)
This is most important to know if you see a red attention sign it means there are JS errors to be addressed - otherwise if you’re not that much into magic 
Js you can also Ignore it
If you have specific things you want to know don’t hesitate to ask!
Im quite familiar with the thing meanwhile and might be able to help with doubts
2 Likes