Tag: css

  • Louis Harboe has recreated the iOS4 icons in Pure CSS. These are incredible, and totally resolution independent.

  • Targeting various iOS devices with media queries

    Targeting various iOS devices with media queries9-bits: Jesse Dodds with an awesome tip for iPhone web devs: You can use the media attribute on webclip icons to specify different resolution icons (like for the Retina display):

  • “Helvetica Neue”, Helvetica, Arial, sans-serif

    What’s your font-stack? UPDATE: Very happy that this works: font: bold 24px/1 inherit; … just not in IE6/7.

  • Chris Eppstein Refactors Digg.com’s Stylesheets Using SASS

    Chris Eppstein Refactors Digg.com’s Stylesheets Using SASSSpoiler: He reduces the lines of code by 32% and fixes six bugs without trying.

  • Totally rad HTML I just wrote

    Jacob Bijani: Clears an input on focus and refills it on blur with the default value if it’s still empty. Totally localization-friendly, framework-agnostic, and you get to use CSS to style both states! Totally just used this.

  • The next person to call any CSS effects sexy should really have some sex to see the difference. Christian Heilmann

  • What the Hex?!?

    nudgeup: > yizzle: I made this little game to train myself to read hex values. http://yizzle.com/whatthehex/ Awesome idea for a game that Yizzle whipped after being inspired from some random conversations. So simple but so good. There’s so many ways to go with this. The mind boggles. This is my new favorite thing.

  • Webkit CSS Properties

    Webkit CSS Properties A list of Webkit-specific CSS properties with explanations of what they do and their possible values. (via webkitbits: jacob)

  • CSS3 Click Chart

    CSS3 Click ChartVery handy quick reference for CSS3, or CSS3-like effects in many browsers including IE. However, it is best viewed in Chrome 4+, Safari 4+, or Firefox 3.6+.

  • Creating a Realistic Looking Button with CSS3

    Creating a Realistic Looking Button with CSS3Jay Air has a terrific write-up about CSS3 buttons. He goes in depth to show you what he’s doing and why. These are beautiful buttons–less flashy and more realistic than these “super awesome buttons”. CSS3 now has such momentum that markup like this must be in your latest designs.…

  • CSSDesk is another beautiful web app by Pixelmatrix Design aka Josh Pyles. Josh says to use this when you want to try out some code but you don’t want to fire up a text editor. Might be handy in a pinch, or for beginners. Read more about CSSDesk on Josh’s weblog.

  • Detecting iPad with PHP/JS/htaccess

    Detecting iPad with PHP/JS/htaccessDavid Walsh writes how to detect the iPad using PHP, JavaScript and htaccess. As a bonus, here’s how to do it with CSS:

  • iPad Orientation CSS

    iPad Orientation CSScameronmoll: According to Jason Grigsby, WebKit on iPad honors CSS media query declarations based on orientation. As such, you can deliver different content based on portrait and landscape viewing by simply adding (orientation:portrait) or (orientation:landscape) to your link element. (See also Jason’s original post.) I

  • Trent Walton uses CSS3 background-clip text & @font-face to create this fantastic digital poster. Love the cross-hatch pattern used for the text shadow. (via webkitbits, esquareda)

  • Conditional Stylesheets for JS Enabled Browsers

    Conditional Stylesheets for JS Enabled BrowsersDaniel Mall writes about how to enable a select stylesheet for browsers with JavaScript enabled. It seems pretty helpful and he says he’s relied on it for a few years. Check it out.