One of the privileges I have experienced in my professional life is having worked with Jeremy Keith of Clearleft. I learned a lot from the author and web developer from our interactions and by studying his code.
One example is a thumbnails carousel he designed. If the browser does not have JS support, the thumbnails are arranged in a grid. If the client does support JS, he wraps-up the thumbnails in a single row inside a horizontally-scrolling carousel, so they can be browsed left to right. The carousel presentation of the thumbnails requires a different set of CSS rules, which override the vanilla styles.
Any site I’m involved in will be following suit.
- Page-specific styles. I see CSS as a way to define general styles that affect large portions of a site (using classes). If you want to do something really, really special on a particular page, just put it inside the handful of elements that want to be different as inline styles. (ID selectors are a dying breed.) There’s no need to define rules in a global style sheet if they’re not really global. If the page has a lot of inline styles, and they are making the markup unmanageable, you can always extract the styles into a page-specific stylesheet. One extra HTTP request on one page (or a handful of pages) won’t kill you or your users.
If I open my Firebug console in the pop-up, I see something like:
Permission denied for <http://assets2.mysitedomain.com> (document.domain has not been set) to get property Window.tinymce from <http://www.mysitedomain.com> (document.domain has not been set).
Chrome’s console, shows a similar error:
http://www.mysitedomain.com and TinyMCE’s document domain will default to
The simple fix is to bump up the document domain on my site’s pages to just
document.domain = 'mysitedomain.com';
(You might also know that cookies need a similar bump when trying to read and write to them across subdomains.)
Although this works, there is a problem for those developing locally: there’s a good chance they’re not developing at
mysitedomain.com but something like
localhost. A page at
localhost certainly isn’t allowed to claim its document domain is
document.domain = /(\w+)(.\w+)?$/.exec(location.hostname);