Jay Robinson

Tag: css

  • The images above show Safari 5.2 with page zoom on at 300%, Firefox 11 at 200%, and Google Chrome Canary at 200% both default and with image-rendering altered, browsing Dribbble. There are times you want to view something at actual pixels, regardless of your browser’s pixel ratio or your display’s pixel density. I went looking…

  • Always Specify Image Dimensions to Avoid CSS Reflow/Repaints

    I took an hour the other day and dove into helpful documentation to avoid CSS Reflows and Repaint, but I came up pretty short; in modern browsers, most of these things don’t add to perceived page load in any significant way. Except one thing that always irks me: Always specify a width and height for…

  • Google HTML/CSS Style Guide

    Google HTML/CSS Style GuideTelling a chick you’re a front-end developer won’t get you laid, but it couldn’t hurt to try. You could always use the phrase “front-end engineer” to make yourself sound smarter. Anyway, HTML and CSS dorkery isn’t for everyone, but this collection of best practices from Google is right up my alley. This…

  • Safari Web Inspector versus WebKit Web Inspector (pictured above) The latest Safari 5.2 Update 3 (available to registered Safari developers) includes a Safari-specific Web Inspector enabled by default. You now have two web inspector’s to choose from: Safari’s, or WebKit’s. You can use the Develop menu to switch between the two. Overall, there’s more consistency…

  • Check out this post I contributed to WebKitBits: -webkit-filter is the new hotness, and it’s coming to your browser sooner than you’d expect! This slide comes from a recent presentation given by Vincent Hardy of Adobe, showing off the rapid innovation in tweaking web graphics. Download the latest WebKit Nightly and take a look!

  • Needed in Photoshop: proportional leading/line height as in CSS

    Needed in Photoshop: proportional leading/line height as in CSSIt’s always bothered me that I cannot effortlessly create proportional line height in Photoshop. The leading widget in the Character panel should use a multiplier of the font size—as in InDesign or CSS. For example, I could set my text to 24px and the leading to a…

  • Replacing the -9999px Hack (New Image Replacement)

    Replacing the -9999px Hack (New Image Replacement)Mike McCarron reblogs Zeldman: .hide-text { text-indent: 100%; white-space: nowrap; overflow: hidden; } I first wrote about this technique in 2009, and had been using it at least a year before that. Because I realized the web should always be future friendly. If you find the better way, start…

  • We have browser specific code for Android 2.2, 2.3, and 4. We have code just for the Kindle Fire and code just for the Blackberry Torch. Our list scroller implementation for Android Gingerbread is based on scroll position animation and our list scroller for Android 4 is based on CSS transforms. This attention to detail,…

  • Learn HTML & CSS Book I am frequently asked what the best book is to learn HTML and CSS. I’ve usually recommended a book by Dan Cederholm, but even his material can presuppose an understanding of the basics of what makes a webpage work. This beautifully designed book by Jon Duckett looks like a perfect…

  • Prefixr beta · Cross-Browser CSS in Seconds

    Prefixr beta · Cross-Browser CSS in SecondsNice little one-trick web app. Example: You write border-radius: 5px it outputs the same with -moz, -ms, -o, and -webkit prefixes. Even includes Microsoft CSS filters for opacity and background gradients in IE.

  • Fuck Yeah CSS Colors!

    Fuck Yeah CSS Colors!Fact: CSS includes 147 standardized color names.

  • Meyer’s Law: Anything that can be done with CSS will eventually be done with CSS. Eric Meyer

  • List of CSS Cursors for WebKit

    List of CSS Cursors for WebKitNeed this every now and then. Thought I had archived it here but I guess not…

  • Some Special CSS for Twitter

    table.columns div#side div#recommended_users { display: none !important; } Make a stylesheet with this rule, go to Safari Preferences > Advanced > Add to Style sheet.

  • Getting Sassy with CSS

    Getting Sassy with CSSDavid Kaneda: My newest post on the Sencha blog covering the wonders of SASS and Compass. Includes a full getting started guide and covers some of the techniques we used in developing the themes for Sencha Touch. Via Sencha tumblelog.