How to change background color of the inspect element pane (i.e. the inspector's pane not the page being inspected)
This pane suddenly changed to a dark blue background. With the font's of the inspected elements having dark foreground colors it is very difficult to read. How do I get the white background back? Thank You.
Chosen solution
Apply the following user style with the Stylish extension.
@namespace url(http://www.w3.org/1999/xhtml); @-moz-document url("chrome://browser/content/devtools/markup-view.xhtml") { body { background: white !important } }
If you need to modify anything else, you can use the DOM Inspector extension to examine user interface elements ("chrome").
If you need help with CSS code, see below for a starting point.
Read this answer in context 👍 2All Replies (4)
Chosen Solution
Apply the following user style with the Stylish extension.
@namespace url(http://www.w3.org/1999/xhtml); @-moz-document url("chrome://browser/content/devtools/markup-view.xhtml") { body { background: white !important } }
If you need to modify anything else, you can use the DOM Inspector extension to examine user interface elements ("chrome").
If you need help with CSS code, see below for a starting point.
Gingerbreadman:
Outstanding! The stylish user style did the trick with the background. Now I'll just tweak it with a bit more CSS and Bob's your uncle. Thanks a million.
See also this stylesheet:
- chrome://browser/skin/devtools/markup-view.css
Cor-el: I got it. Thank you for taking the time. Appreciated.