Tag Archives: css
The CSS Pocket Guide – Free Sample Chapter
Peachpit has just posted a free sample chapter–Measurements, URLs, and Color Units–from my recent book The CSS Pocket Guide. This chapter explores length units, color schemes, and other measurement values used for defining values of CSS properties.
Read my earlier blog post on The CSS Pocket Guide for more info about the book at how to buy it! And if you already have, please let me know what you think in the comments here or via reviews on your favorite book retailer’s web site. Continue reading
This entry was posted in web and tagged book, css, csspg, free, Peachpit, The CSS Pocket Guide, web standards, writing. Bookmark the permalink.
The Book, It’s Real!
This entry was posted in meta, web and tagged book, css, csspg, Peachpit, photo, The CSS Pocket Guide, web design, web development, web standards, writing. Bookmark the permalink.
The CSS Pocket Guide
Alternate Title: What I did on my Summer Work-cation
This blog has been a bit quiet the last few months—a direct result of spending all of my non-work hours writing my first book. The CSS Pocket Guide, the results of all that effort, was just sent off to the printers earlier this week and hits the bookstores on October 25.
This entry was posted in meta, web and tagged book, css, csspg, Peachpit, preorder, The CSS Pocket Guide, web design, web development, web standards, writing. Bookmark the permalink.
PNHTagTest Now On GitHub
Taking a moment away from a truly busy summer of client work and other fun projects to bring you this little announcement:
There’s now a permanent home on GitHub for PNHTagtest, a little piece code that I’ve had floating around for ages as an aid for building and reviewing CSS on a project.
This entry was posted in meta, web and tagged best practices, css, GitHub, HTML, Lorem Ipsum, markup, PNHTagTest, project, sample code, web design, web development. Bookmark the permalink.
CSS Generation With JavaScript – An Underutilized Content Management Tool
There are some interesting new things going on the world of web site layouts with CSS and JavaScript all the time. Tricks and tools to add to a client side developer’s arsenal for making flexible, content accommodating navigation, layouts and presentations. Though I wouldn’t give away any of our progress, I can’t help but wonder if sometimes the amount of work we ask a visitor’s browser to do is overkill. One way to shift this workload off the browser — without placing undo burden onto the site management staff or its budget by requiring a high level of technical expertise with each site update — is to move the it to an offline or backend CMS tool creating static code for publication. This is particularly useful when doing multiple site deployments with a similar theme or building different localized site versions where the need for flexibility in type doesn’t change from user to user, but from content update to content update or deployment to deployment.
Through the use of fairly simple to create build tools we can create ‘static’ CSS for deployment and consumption and trim the amount and complexity of layout code sent with each page.
This entry was posted in project52, web and tagged build tools, CMS, css, font size, javascript, jQuery, jQuery UI, layout, localization, offline tools, p52, typography. Bookmark the permalink.
CSS3 Box Shadow in Internet Explorer [Blur-Shadow]
For a recent project I was given the task of creating a lightbox style help dialog. The dialog was intended to highlight content of an odd or unknown size in addition to the more controlled information box. Essentially a figure in the shape of 2 adjacent rectangles of variable sizes that needed to be highlighted. The backbreaker — the 8 sided popup needed a large, opaque & diffuse drop shadow to make it stand out off the content.
This was the perfect use case for CSS box-shadow, but its also a public facing promotional site that for good reasons couldn’t just thumb its nose atMicrosoft Internet Explorer. The value proposition for any new CSS property – to make things like shadows and gradients easy to develop and manage with one rule replacing old complex solutions – is lost if you still have to code for that old complex solution juggling multiple PNG images and layering in added markup. Still, that work sounded painful to write for IE6, IE7 & IE8 as well as Firefox, Safari and Chrome so I started looking for an alternative in the proprietary MS filters which are supported in Internet Explorer 5.5 and up.
This entry was posted in project52, web and tagged blur, box-shadow, css, drop shadow, ie filters, msie, p52, tutorial, web design, web development. Bookmark the permalink.