How to reposition Chrome Developer Tools
The tools are opened on the bottom of the chrome window per default. This is a rather bad choice for a wide screen display since there is plenty of empty space to the right but not much vertical space to spare. Unfortunately, I have found no way to reposition the tools. I would like to have them on the side, similar to firebug.
The only option similar to what I want is to detach the dev tools and place chrome and the tools window side-by-side. This is not very convenient for quickly alt-tabbing from the IDE to the browser and back though, so an "integrated" solution would be nice.
Chrome 46 or newer
Click the vertical ellipsis button ( ⋮ ) then choose the desired docking option.
Chrome 45 or older
Long-hold the dock icon in the top right. It pops up an option to change the docking
To change the split between the HTML and CSS panels, go in DevTools to Settings (F1) > General > Appearance > Panel Layout.
- console.log timestamps in Chrome
- handle both mouse and touch events on touch screens
- svg path not drawing for single point on chrome surface
- Why does my Angular 9 sort routine work great when using Google Chrome (Ch131) browser, but works poorly (gets Wait msg) when using MS Edge (Ch131)?
- Is there any way to debug chrome in any IOS device
- Retrieve a request using the requestId after the response is received in Firefox extension
- Chrome DevTools Debugger freezing once it hits breakpoint
- Is it possible to save MHTML with scripts included?
- Is there any way to use Web Share Api for other browsers than Chrome
- Process.Start(...) Suddenly Fails when Called by ASP.NET MVC 5 Running in IIS on Windows 10 and Windows Server 2019
- Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "text/html"
- Finding JavaScript memory leaks with Chrome
- Video auto play is not working in Safari and Chrome desktop browser
- Google Chrome not launching on Ubuntu even after installing it
- Using Selenium on Mac Chrome
- Selenium - This version of ChromeDriver only supports Chrome version xx
- Debugging iframes with Chrome developer tools
- Chrome Print to PDF via Windows Command Prompt
- Using --js-flags in Google Chrome to get --trace output
- Using Google Charts in Chrome extension
- open multiple tabs on a single window by a single click using JavaScript
- Chrome DevTools - Performance Tab Summary
- What are the requirements for audio output in Chrome on Android?
- How can you hide the arrow that is displayed by default on the HTML5 <details> element in Chrome?
- How to use selenium with proxy auth in headless mode?
- How to detect ECMAscript version?
- autocomplete= off not working in chrome
- Why does menu item "Save all as har" no longer exist in chrome and what to do instead?
- How can I detect device touch support in JavaScript?
- WebDriverException: unknown error: DevToolsActivePort file doesn't exist while trying to initiate Chrome Browser