CssCreator -> Page Layout: this generator will create a CSS layout that has fixed width left and/or right columns with a dynamic width center column, all the same height with header and footer.
SelectOracle Explains the structure of CSS- and HTML-documents. Enter semi-colon separated selectors or just paste in your existing rulesets into the “Direct Input area, or provide the URL of a stylesheet or an HTML document with an embedded stylesheet in the “URL Input area. English, Spanish, German and Bulgarian versions are available.
Tom Lee has a tutorial on Max-width in IE Using a CSS Expression. Word of caution: I hear using this method can be rather hairy, in some cases crashing the browser.
Images, Tables, and Mysterious Gaps seems like something I should’ve known already about the behavior of inline elements in strict mode. But of course it took me an hour of agony before finally realizing the ultimate truth: I’m not that smart.
snook.ca on the “+ CSS hack which you can use to target IE6 and IE7 only.
On having layout 提供了很多信息围绕IE其特有的“渲染概念:hasLayout — one of the major causes for headache when it comes to how IE decides to pain the boundaries of certain HTML elements:
Negative text-indent and underline — No matter how far on the left the real text is, the underline will be stretched all the way to the right in some PC browsers, namely the Firefox.
IE6 Multi Class Bug — Again, something that could’ve brought to my attention last week!
…Internet Explorer fails to render backgrounds for elements that have both an ID and a class defined. For instance, #photos.background1 will display the corresponding background in IE6 for Windows, but once that has been defined, #photos.background2, #photos.background3, etc. will not be displayed.
Clagnut shows you how to have Line breaks in tooltips by using the carriage return entity . How utterly simple!
Styling check boxes and radio buttons only with CSS uses 100% CSS solution (via attribute value selector and positioned background images) to serve up customized form elements. It’s semantically correct and degrades well for browsers that doesn’t support this method (IE), but is it also accessible?
Stuart Robertson’s CSS text shadow technique seems like one of the easiest-to-implement techniques I’ve come across. It uses :before pseudo element and supports both Safari and Firefox browsers.
CSS Colors: Take Control Using PHP is a wonderful tutorial from Barely Fitz on how to use PHP variables to represent colors in your CSS which you can then manipulate — quickly changing all the colors from a single source, generating new colors via algorythm, etc.
Dynamic Drive, a long time favorite DHTML code snippet depot of mine, has started a new spin-off: CSS Drive.
A More Accessible Map — a new tutorial on ALA shows how to create an accessible map with tooltips via CSS and JS.
Styling horizontal rules with CSS — “…Don’t waste hours trying to style horizontal rules consistently across different browsers. Instead wrap your HR in a DIV, set the HR to display none and style the surrounding DIV instead.. Now why the heck didn’t I think of that?
CSS image preloader technique from maratz.com — using background image CSS property on images to serve as image place holders.
codylindley.com’s Pushpin Header Technique “…is a CSS solution for creating a stationary header out of the thead of a table while the table’s tbody remains scrollable
hovebox image gallery via sonspring. It’s sort of like mini-lightbox that enlarges the thumbnails on hover. Very nice.
Beautifully Numbered Lists looks nice except that it’s not really an ordered list. Instead it used definition lists inside the ordered list for presentation — which means true standardistas might object.
Eric Meyer, the man with CSS skillz that payz da billz, reveals something I’ve never heard of before: line-height property can use unitless values! The differences between united vs. unitless declarations are well described in his article but I can’t believe that I had it all wrong. I’ve been telling everyone that “You must declare unit for ANY measurement values unless it’s zero.
Another very nice tutorial from 24ways. This time it’s Curly Quotes Without Images, a technique popular in citing blockquotes with enlarged quotation marks in the beginning and at the end of the quote. But without using background images.
FACE is an interesting javascript-powered / CSS-controlled page animation technique.
Defining CSS constants using PHP is a good article on using PHP to allow constants (’variables’) in CSS. For instance you can use this technique to define a repetitive color in CSS as a variable. That way you only need to declare it once and only change that one instance should you want to change that color. Very handy.
From the “How the heck did I miss this department: cssQuery a powerful cross-browser JavaScript function that enables querying of a DOM document using CSS selectors. All CSS1 and CSS2 selectors are allowed plus quite a few CSS3 selectors.