When I inspect html/css on a website, I usually open the chrome developers panel ctrl+shift+I → right click context menu "inspect" so I can highlight that class
however, sometimes I'm trying to inspect an element that is sensitive to "right clicks" events , e.g. if I right click an item on the website functionality changes
Example:
so I can't inspect an element
Normally I inspect elements like this (e.g. stackoverflow)
How do you inspect an element without using the right click button?
Normally I would have to just dig through the chrome developer's panel elements and just go one by one to find said element, which takes a really long time
I must be missing something important here about chrome's inspect element tools. Could someone enlighten me here a better workflow / maybe chrome extension tools?
When I inspect html/css on a website, I usually open the chrome developers panel ctrl+shift+I → right click context menu "inspect" so I can highlight that class
however, sometimes I'm trying to inspect an element that is sensitive to "right clicks" events , e.g. if I right click an item on the website functionality changes
Example:
so I can't inspect an element
Normally I inspect elements like this (e.g. stackoverflow)
How do you inspect an element without using the right click button?
Normally I would have to just dig through the chrome developer's panel elements and just go one by one to find said element, which takes a really long time
I must be missing something important here about chrome's inspect element tools. Could someone enlighten me here a better workflow / maybe chrome extension tools?
Share Improve this question asked Jun 17, 2017 at 14:25 Vincent TangVincent Tang 4,1706 gold badges52 silver badges70 bronze badges 1- ah okay the ctrl+shift+C method works really well here. i.imgur./qJ5maMM.png – Vincent Tang Commented Jun 17, 2017 at 14:30
3 Answers
Reset to default 5Try pressing ctrl+shift+c
. This will open the dev tools in element selection mode, allowing you to left-click on elements to jump straight to them in the elements view.
You can press Ctrl+Shift+C to enter a mode where you can mouse over elements and it will inspect it. With your mouse over the element you want to inspect, just press Ctrl+Shift+C again and your element will be selected in the developer panel.
You can open the dev tools on a different windows and refresh your page or use firebug.
or use Firefox