Posh CSS # for the modern day web designer

Cross browser compatibility can be hard to achieve, but if you follow a few guidelines, you can make your CSS cross browser compatible a lot easier.

CSS has brought us many capabilities in terms of typography and the web, but we always seem to be limited to the same 4-5 typefaces over and over again. There is an inherant problem, if the font you specify isn’t on the viewers computer it won’t render in that font. But there are quite a few high quality typefaces that are available on most new computer systems and you can always fall back on the common ones.

Templates, Styles and Better Formatting have been among the most requested Google Docs features. Well, you asked and we listened!

If you’ve ever attempted to style a button inside IE, you know that it can be a huge pain. This quick tip fixes the problem.

Using the :first-letter pseudo-element, you can easily create nice drop caps with CSS. No extra HTML or Javascript required and IE5+ browser support.

Conditional comments only work in Internet Explorer, and are used to target specific versions. They use the HTML Comment structure, and thus are placed in the HTML not the CSS. This makes them perfect for linking to alternate IE only stylesheets, which for example, wouldn’t use 24-bit PNG transparency etc.

Here’s the problem: you have a container with some content in it like an image along with some initial descriptive text. Then, when users hover their mouse over the container, a hidden container is revealed to present additional information over top of the current information but in a way that retains content from the original container.

There are many ways to position your elements in CSS. Relative positioning, absolute positioning, float or a combination of them. Those different techniques are clearly explained with example pages and coding examples.