0 notes
web dev
chrome
chrome canary
development
dev tools
discoveries
canary dev tools discoveries
I’d switched to Chrome Canary for development a couple weeks ago, and had noticed a couple new things about their dev tools (for instance, the file browser in the Scripts panel) but this post on Modern Web Development by Majd Taby led me to some other neat discoveries. When you find out about the settings button in the dev tools, you realize you can do such things as:
- Dock the dev tools to the right — not only is this a convenient place for the tools, but it also means that you can size the viewport smaller than 400px, something you can’t do by manually sizing the Chrome window itself.
- Disable the cache.
- Override User Agent — no more clunky user agent switching extensions, Canary will switch the agent for you.
- Override device metrics — likewise, exact sizing on the viewport, no extension necessary.
- And much much more! (e.g., setting default color format and indentation size, emulating touch events, etc.)
Also, (FINALLY), you can resize the console text by pressing Cmd + and Cmd -. I’ve been waiting for this feature forever. Forever is now, my friends.
Notes
web dev
links
css
10 random CSS tricks
I could have used at least two of these tricks this week, like:
1. Set body font-size to 62.5% for Easier em Conversion
9. Prevent Line-Wrapping of Text Elements
The em tip seems obvious enough that I’m dismayed I didn’t think of it myself.