Chrome Dev Tools – “Size” vs “Content”

“Size” is the number of bytes on the wire, and “content” is the actual size of the resource. A number of things can make them different, including: Being served from cache (small or 0 “size”) Response headers, including cookies (larger “size” than “content”) Redirects or authentication requests gzip compression (smaller “size” than “content”, usually) From … Read more

How to debug web sites on mobile devices?

This is the correct answer, not sure why Blaine only left it as a comment! As of iOS 6 Remote Debugging is available: https://stackoverflow.com/a/12762449/72428 On OS X you can use the Safari web inspector on the iOS Simulator AND iOS 6 devices. First enable the Developer menu in Safari on your Desktop. Next, enable remote … Read more

Using Chrome’s Element Inspector in Print Preview Mode?

Note: This answer covers several versions of Chrome, scroll to see v52, v48, v46, v43 and v42 each with their updated changes. Chrome v52+: Open the Developer Tools (Windows: F12 or Ctrl+Shift+I, Mac: Cmd+Opt+I) Click the Customize and control DevTools hamburger menu button and choose More tools > Rendering settings (or Rendering in newer versions). … Read more