When we turn on dev tools in Firefox, especially the 'inspector', and we select some element, Firefox marks the element in the main view. This also happens, when we console.log(someHtmlElement) and then we hover over it in the console.

This is usually useful but not always. So my question is, how to tell Firefox to not show the highlight/guides for those elements?

Here is a screenshot to illustrate what I mean:

example image of guides in Firefox dev view

  • 1
    In which cases isn't it? Please inline your picture and fix your format. It's pretty horrible. It doesn't look like it's currently possible to disable that feature. You might be able to disable it using an addon. – Seth Apr 30 '18 at 6:04
  • @Seth - thanks. I inlined the image and removed an unnecessary annotation, hope this is what you mean by "horrible format"? Anyway - if this isn't possible then I guess I'll file an issue :) - Thanks again! – konrados Apr 30 '18 at 6:12
  • 1
    Way better. I was referring to the single dash with that additional line that didn't do anything. It just really looked odd. If you look into the GCLI you might be able to dig into inspect to figure out what's responsible for displaying those guides. – Seth Apr 30 '18 at 6:30
  • @Seth oh, ok gotcha, thanks for the edit! And ok, let me see this GCLI, I've never used this before, I didn't even know about this thing :) Thanks! – konrados Apr 30 '18 at 6:37
  • 1
    @Seth thanks again. The GCLI isn't the answer, although there is the highlight command, and it really was fun to play with the tool, it definitely isn't really helpful:) Thanks for the info, though. I have learned about the tool. – konrados Apr 30 '18 at 15:00

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.