Cascading stylesheets...
This post was originally published on May 13th, 2004. As others are writing about the topic, I thought bringing it out of the archives would be worthwhile. A little recap The idea of placing multiple states of buttons and other elements that are used in background images took its roots, I believe,... Read more »
Please note that some links in this post are affiliate links. The Target Market The CSS Anthology was written for people who have some basic knowledge in CSS but need a place to turn to to find out what is the right way to do 'X' with CSS. Chapter 1 provides an overview of CSS, looking at selectors,... Read more »
Multiple IE standalones A while back Joe Maddalone uncovered how to set up multiple standalone versions of IE. This was great news, but one of the shortfalls was that they didn't accurately handle conditional comments. Thank you Manfred! Well, a short while ago over at PIE, guest author Manfred Staudinger... Read more »
The discovery Sitepoint CSS guru Paul O'Brien has discovered that by applying overflow:auto to the CSS rules for a parent div that contains a floated element, the parent div will expand to completely contain the floated element. Go check it out Check out the Sitepoint blog post here, and the example... Read more »
Before we get into the good stuff, a few little notes about dynamic CSS, something used in a few of the ideas discussed below. Dynamic CSS Many people are toying with the idea of dynamic stylesheets by doing some server side magic with their CSS by parsing it (with php, asp etc.) before it leaves the... Read more »
The "young-old" technology that is CSS has proliferated over the last few years thanks to projects like the Wired redesign (and later more high profile redesigns, more examples...) and the CSS Zen Garden. Along with this, more and more designers are adding CSS to their toolkits and making their lives... Read more »
For the curious and impatient, Example A, B. The requirements A project we've been working on required a different colored set of tabs for navigation depending on the section that the users were using. We needed three color variations and we wanted to be able to easily change the colors used... Read more »
Okay, we're still on haitus, however I'm chiming in with a quick reader survey. Users who do comment, and keep a cookie from this site, will not be subjected (once the reworking is launched) to the Adsense ads that are here now (thanks Simon for the help). So lets have it, what's helping... Read more »
Updated on 01/09/2004. While working the CSS for a design today, something occurred to me. Since we've been looking at using php with our css, many possibilities open up. These of course assume that you are passing your CSS to the PHP script handler... Note that I am using PHP and Apache here. Comments I'd... Read more »
A while back Douglas Bowman wowed Alistapart readers with his excellent article Sliding Doors of CSS, describing a new and revolutionary way to build a tabbed menu interface using CSS. Shortly thereafter, Dave Shea came along with CSS Sprites: Image Slicing’s Kiss of Death. In the article, Dave... Read more »
As alluded to in a previous entry, some interesting yet, quite possibly trivial observations were noted while testing the caching behavior of CSS files in Opera 7.50, Firefox 0.9, and Internet Explorer 6.0.So with no further ado, on to the facts... How our browsers request CSS files Part of the cache... Read more »
Note: This post was originally published on June 13th, 2004. It is being republished today because: the topic has been discussed in a few places recently, and, well, I accidentally republished it when editing it. Background Info This whole idea started back in February of 2004 and has evolved through... Read more »
The "official line" on this topic is being archived and updated here. Alun Bestor mentioned in the comments of Organizing and Optimizing Your CSS - Some ideas something that, after a little testing, was worth a post of it's own. Background information on this topic can be found in the original... Read more »
Pull quotes, it turns out, are a well discussed topic on the web. I happen to find them useful, and they can be very eye catching. Have a look at some of these great examples of pull quotes by Mike Pick, for example (ironically, while setting out to find a decent example of a pullquote for this post,... Read more »
A lot of CSS posts here lately, a reflection of the stages we are at for a few of our projects. Some of our recent work has seen us build some relatively complicated style-sheets, a reflection of shooting for full cross browser compatibility using only CSS and also using some of the design effects that... Read more »
Note: The "official line" on this topic is being archived and updated here. A while back I wrote up a post that explained how you could use PHP's output buffering to take advantage of HTTP Compression and compress your CSS files. To summarize, your css files download faster by compressing them with... Read more »
How To Attack An Internet Explorer (Win) Display Bug John Gallant and Holly Bergevin are up to their bug killing ways, this time helping us mere mortals come to grips with things such as the Peekaboo Bug and the Escaping Floats Bug, and how can be used to help us with some of IE's enigmatic problems.... Read more »
Skip links are really catching on for reasons of accessibility. You know the ones, they sit there in the background, hidden by CSS, offering non-css enabled browsers and other devices the opportunity to 'Skip to Navigation', or 'Skip to Content'. Most people place them at the top of... Read more »
Personally, I'm a huge fan of some of the beautiful work being done on websites that are styled with CSS. One look at the vault and you'll find many examples of great work. One of the shortfalls I'm seeing more and more is designers who rely a little too heavily on background images to pretty... Read more »
Its in the Details This is the first entry for what will be the 'Cool Tricks with CSS' category of this blog. Though not really a trick, this first example, from Dunstan Orhcard's blog, hilites a case of great attention to detail, the kind that can make your clients look good, which of... Read more »
Updated: New content added 12/03/2004. Here's a little something that has come in useful for me on a few occasions. It seems to be inevitable that at some point along the life of a project, someone from your clients company decides that they don't like the <insert style element here />... Read more »
A few people that I work with have asked me about this little trick, so I thought I'd write something up here to explain it. A little article entitled "Filling a block level element with an anchor I", it explains just that: how to fill a block level element with a hyperlink. This first pass is a... Read more »
The goal of the challenge: come up with a chunk of semantically valuble markup and the CSS that would reproduce the search result represented by the above image. Being a search result, the code had to allow for the possibility of several instances of the object on one page. Besides my own example,... Read more »
You think you know your stuff? Lets see what you got! An aspect of a design that I am working on provided me with a bit of a challenge. The following image is the piece of design in question: What is the challenge? Take this image, and come up with the sematically valuble markup and CSS to make this... Read more »
Note: This entry was updated on the 23rd of February. A summary of the process can be found here. History Late last year I had the pleasure of redesigning a site that I'd coded a mere 6 months earlier. Talk about a humbling experience, it seems that I had a bad case of classitis during the first... Read more »
Sitepoint's web devlopment books have helped me out on many occasions both for finding a quick solution to a problem but also to level out my knowlegde in weaker areas (JavaScript, I'm looking at you!). I am recommending the following titles from my bookshelf:
I started freelancing by diving in head first and getting on with it. Many years and a lot of experience later I was still able to take away some gems from this book, and there are plenty I wish I had thought of beforehand. If you are new to freelancing and have a lot of questions (or maybe don't know what questions to ask!) do yourself a favor and at least check out the sample chapters.
The author line-up for this book says it all. 7 excellent developers show you how to get your JavaScript coding up to speed with 7 chapters of great theory, code and examples. Metaprogramming with JavaScript (chapter 5 from Dan Webb) really helped me iron out some things I was missing about JavaScript. That said each chapter really helped me to develop my JavaScript skills beyond simple Ajax calls and html insertion with libs like JQuery.
Like the other books listed here, this provides a great reference for the PHP developer looking to have the right answers from the right people at their fingertips. I tend to pull this off the shelf when I need to delve into new territory and usually find a workable solution to keep development moving. This only needs to happen once and you recoup the price of the book in time saved from having to develop the solution or find the right pattern for getting the job done..