/home » workblog

Entries for the ‘CSS’ Category

CSS Selector Browser Compatbility

kimblim.dk has a chart showing browser support for various CSS selectors, including pseudo selectors. It includes CSS versions 1 through 3 and all of the major browser versions.

Content Above Anchors Disappear

It turns out there’s a serous problem with the One True Layout method of creating equal height columns. All of the content above an anchor will be shifted up, making it seem like it disappeared. There aren’t any universal or reliable fixes for this, so the Faux Columns method is probably the best choice if [...]

Using overflow to Clear Floated Elements

If you have an element whose children are all floated, it won’t have any height to it. I’ve always just put an extra <div style=”clear: both;”> at the bottom of the container to force it to clear, but it looks like there’s been a much better way for a few years now. Alex Walker points [...]

Placing an Element In Front of an Object

Here’s how to have a drop-down menu appear on top of a Flash object:

Add a z-index of 0 to the object’s containing div
Add <param name=”wmode” value=”transparent”> inside the object tag
Add wmode=”transparent” to the embed tag

via Sheriar Designs

The Best Way to Define Font Sizes in CSS

Often designers will want fixed font sizes so that the text on the actual size will exactly match their mockups, but The Web is Not Print (see also Pixel Perfect Design Does Not Necessarily Equal Good Web Design). A List Apart has a worked out a good method for sizing text consistently across browsers while [...]

CSS Drop-Down Menus

Tomas Bagdanavicius has created a fast, themeable, cross-browser CSS-based Drop-Down Menu Framework that only uses Javascript for IE6.

Preloading Images

I’ve been looking for a good way to preload images for rollovers, but it seems like a lot of the common methods have problems.

There are reliability issues using a JavaScript Image object or document.write()
Some browsers won’t load a display:none containing element

So far the best way I’ve found is Perishable Press’ Better Image Preloading without JavaScript [...]

Clearing a Browser’s default CSS stylesheet

Clear a browser’s default CSS stylesheet
Update: After working with it for a little while I prefer using Yahoo’s Reset CSS, Base CSS and a few custom values to Meyer’s version. I think he takes it too far (almost to the point of absurdity) with things like stripping the weight from the strong tag.

/* YUI Reset [...]

Targeting properties to IE6 with Valid CSS

When I’m translating a design to markup I can usually get it to look the same in all the major browsers without too much trouble, but every once in awhile there’s a problem with IE6 that I can’t figure out, or just don’t have the time/energy to deal with the right way. In the [...]